목록 꾸미기

특정 순서에 있는 요소 선택하는 방법 - :nth-child(), :nth-last-child()

웹 문서에서 특정 부분에 스타일을 적용하려면 보통 class나 id 선택자를 이용해 이름을 붙여 주고 그 클래스아 id에 대한 스타일을 정의하면 됩니다. 하지만 여러 개의 항목이 일렬(가로나 세로)로 나열되 있는 경우, class나 id를 사용하지 않고 …

목록의 내용만 가운데 정렬하기 목록 안의 내용만 가운데 정렬할 때는 text-align 속성을 사용합니다. < ul > < li > Lorem Ipsum </ …

순서 없는 목록의 경우, 목록 앞에 다양한 불릿(bullet)을 넣을 수 있고 순서 목록에서는 번호 스타일을 지정할 수 있습니다. 이때 list-style-type 속성을 이용합니다.

목록을 만들 경우 목록 앞의 불릿이나 번호는 실제 내용의 바깥쪽에 표시됩니다. 하지만 list-style-position 속서을 이용하면 실제 내용이 시작되는 위치에 불릿이나 번호를 표시하기 때문에 결과 화면에는 불릿이나 번호가 좀 더 안쪽으로 들여 …

list-style-type 속성에서 순서 없는 목록 앞에 붙는 불릿의 유형이 단조로운 편입니다. 불릿의 모양을 더 다양하게 사용하고 싶다면 list-style-image 속성을 이용해 불릿을 원하는 이미지로 바꿀 수 있습니다.