Code Thuộc tính list-style-type trong CSS

Trình soạn thảo - Code Thuộc tính list-style-type trong CSS

Kết quả - Code Thuộc tính list-style-type trong CSS

Tự code rồi chạy thử... Chạy Thử 
<!DOCTYPE html>
<html>
<head>
<title>Code Thuộc tính list-style-type trong CSS</title>
<style>
* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
ul{background: #ddd;}

#circle li {list-style-type:circle;}
#auto li {list-style-type:auto;}
#disc li {list-style-type:disc;}
#lower-alpha li {list-style-type:lower-alpha;}
#square li {list-style-type:square;}
#upper-alpha li {list-style-type:upper-alpha;}
#upper-roman li {list-style-type:upper-roman;}
</style>
</head>
<body>

<h1>Code Thuộc tính list-style-type trong CSS</h1>

<p>Dùng để chọn các loại ký tự đầu dòng cho thẻ li như: hình tròn, hình vuông, con số, chữ số, chữ la mã....:</p>

<ul id="circle">
<li>list-style-type:circle;</li>
<li>list-style-type:circle;</li>
<li>list-style-type:circle;</li>
</ul>

<ul id="auto">
<li>list-style-type:auto;</li>
<li>list-style-type:auto;</li>
<li>list-style-type:auto;</li>
</ul>

<ul id="disc">
<li>list-style-type:disc;</li>
<li>list-style-type:disc;</li>
<li>list-style-type:disc;</li>
</ul>

<ul id="lower-alpha">
<li>list-style-type:lower-alpha;</li>
<li>list-style-type:lower-alpha;</li>
<li>list-style-type:lower-alpha;</li>
</ul>

<ul id="square">
<li>list-style-type:square;</li>
<li>list-style-type:square;</li>
<li>list-style-type:square;</li>
</ul>

<ul id="upper-alpha">
<li>list-style-type:upper-alpha;</li>
<li>list-style-type:upper-alpha;</li>
<li>list-style-type:upper-alpha;</li>
</ul>

<ul id="upper-roman">
<li>list-style-type:upper-roman;</li>
<li>list-style-type:upper-roman;</li>
<li>list-style-type:upper-roman;</li>
</ul>

</body>
</html>