css設定帶有正方形項目的清單的方法：先建立一個HTML範例檔案；然後使用ul無序列表標籤，並指定「list-style-type」為「square」即可設定帶有正方形項目的清單。
本教學操作環境：Windows7系統、HTML5&&CSS3版，DELL G3電腦。
推薦：css影片教學
css如何設定帶有方形項目的清單？
設定方形項目的清單我們需要使用ul無序列表標籤，並指定list-style-type為square。
範例：
// css
ul.square {
list-style-type:square; /* 每一项前都是正方形 */
}
// html
<ul class="square">
<li>eight</li>
<li>glasses</li>
<li>of</li>
<li>water</li>
</ul>效果：
#下面是一些常用的清單樣式：（推薦學習：CSS影片教學）
<!DOCTYPE html>
<html >
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
ul.circle {
list-style-type:circle; /* 每一项前都是圆圈 */
}
ul.square {
list-style-type:square; /* 每一项前都是正方形 */
}
ol.upper-roman {
list-style-type:upper-roman; /* 每一项前面都是大写罗马数字 */
}
ol.lower-alpha {
list-style-type:lower-alpha; /* 每一项前都是小写字母 */
}
</style>
</head>
<body>
<ul class="circle">
<li>1</li>
<li>2</li>
<li>3</li>
</ul>
<ul class="square">
<li>1</li>
<li>2</li>
<li>3</li>
</ul>
<ol class="upper-roman">
<li>1</li>
<li>2</li>
<li>3</li>
</ol>
<ol class="lower-alpha">
<li>1</li>
<li>2</li>
<li>3</li>
</ol>
</body>
</html>效果：
以上是css 如何設定方形項目的列表的詳細內容。更多資訊請關注PHP中文網其他相關文章！
