[javascript] 화면 스크롤시 사이드 메뉴 색상 변경하기

이번 포스팅에서 화면을 스크롤시 사이드 메뉴의 색상이 자동으로 변경되는 소스를 알아보겠습니다.해당 영역에 넘어가면 사이드 메뉴에서도 색이 변하면서 반응하고 사이드 메뉴를 클릭시 해당 위치로 이동하는 소스입니다. HTML Section 1 Section 2 Section 3 Section 4 Content 1 Content 2 Content 3 Content 4  CSSbody { margin: 0; font-family: Arial, sans-serif;}.sidebar { width: 200px; background-color: #f4f4f4; position: ..

• format_list_bulleted 코딩/Javascript
• · 2024. 8. 1.
• textsms

[CSS] 한눈에 보는 Flex 속성 이해하기

웹사이트의 구조를 구성할 때 예전같은 경우 float 또는 inline-block 등의 속성을 이용해 도움을 받았지만 시간이 갈수록 반응형 웹디자인이 대중화되면서 Flex 속성을 많이 이용하는 것 같습니다. 이번 포스팅에서는 Flex에 대해 공부하고 어떤 속성들이 있는지 확인해보겠습니다. Flex 적용하는 방법Flexible Box, Flexbox 라고 불리기도 하는 Flex는 적용하는 방법이 매우 간단합니다.정렬시키고 싶은 요소들의 부모 속성에 display:flex; 만 입력해주면 끝! .container { display:flex;} display : flex Flex 속성에 대해이번에는 Flex를 적용한다면 어떠한 속성을 추가로 부여할 수 있을지 알아보도록 하겠습니다. 속성의미displayFl..

• format_list_bulleted 코딩/HTML ㅣ CSS
• · 2024. 7. 31.
• textsms