목록CSS (2)
렝무식

어제 태그로 슬라이드 영역에 사용되는 불릿 버튼을 만드는 예제를 포스팅 했었는데요. 오늘은 이 불릿버튼을 이용해서 메인 슬라이드의 겉모습을 만드는 예제를 한 번 복습해보겠습니다! (다른 수강생 분의 홈페이지 리뉴얼 시안이라서 기업이름을 좀 지웠습니다..ㅎㅎ 어짜피 세세한 텍스트보다는 레이아웃이 중요하니까 대충 넘어갈게요.) 슬라이드 영역이 있고, 텍스트가 오른쪽에 배치되어있으며, 텍스트 영역 안에 창업문의안내로 이어지는 링크버튼이 있는 형태입니다. 그리고 아래쪽 가운데에 슬라이드 불릿 버튼이 있습니다. 이런 경우는 영역을 다음과 같이 나누는 것이 좋습니다. ✅ HTML 상생하는 기업, OOO입니다. 창업문의하기 (1) 슬라이드 이미지가 들어갈 영역 (div) (1-1) 텍스트들이 들어갈 영역 (div) ..

display 속성은 해당 요소를 어떻게 보여줄 것인지에 대해 결정할 수 있는 css 속성입니다. 보통 관련있는 것들을 나열할 때, 과 태그를 이용합니다. ul li 태그는 본래 순서가 없는 요소의 리스트를 작성할 때 사용하는 태그지만, 실제로 그러한 용도로는 잘 쓰지 않는 것이 대부분입니다. 그런데 ul li 태그는 블록 요소이기 때문에 가로로 나열되지 않고, 보통 아래로 나열됩니다. 우리가 원하는 레이아웃을을 만들기 위해서는 가로로 나열이 되어야 하는데, 이때 사용할 수 있는 방법 중 하나가 바로 display: inline-block으로 속성을 변경해주는 방법입니다. block 요소의 특징은 다음과 같습니다. 줄 바꿈 발생 너비(width)의 기본 값이 100% 높이(height)의 기본 값은 0 ..