CSS list-style-type 속성은 목록 항목의 마커 스타일을 지정하는 데 사용됩니다. 이 스타일을 순서가 지정되지 않은 목록과 순서가 지정된 목록 모두에 적용할 수 있습니다.
구문
CSS list-style-type 속성의 구문은 다음과 같습니다 -
Selector {
list-style-type: /*value*/
} 예시
다음 예는 목록 스타일을 보여줍니다.
<!DOCTYPE html>
<html>
<head>
<style>
ol li {
padding: 5px;
list-style-type: lower-roman;
}
li:last-child {
font-size: 1.2em;
font-style: italic;
list-style-type: circle;
}
</style>
</head>
<body>
<ol>
<li>demo1</li>
<li>
demo 2
<ul>
<li>demo a</li>
<li>demo b</li>
</ul>
</li>
<li>demo 3</li>
</ol>
</body>
</html> 출력
이것은 다음 출력을 제공합니다 -
예시
<!DOCTYPE html>
<html>
<head>
<style>
ol li {
width: 50%;
margin: 5px;
font-size: 1.2em;
list-style-type: devanagari;
border: thin solid;
background: linear-gradient(to right, lightgreen, pink,lightblue);
}
li:last-child {
font-style: italic;
list-style-type: lower-latin;
}
</style>
</head>
<body>
<ol>
<li>Eh!?</li>
<li>
demo one
<ol>
<li>What!?</li>
<li>demo two</li>
</ol>
</li>
<li>demo 3</li>
<li>demo four</li>
</ol>
</body>
</html> 출력
이것은 다음과 같은 출력을 제공합니다.
