Ul li排版使用

Html用css對UL li排版使用小例子:

<style>
				.faceul{
					margin: 20px auto;/*上下20px,左右居中 如果是四個參數的話,是上右下左*/
					width: 350px;
					height: 500px;
					border: 1px solid blue;
					list-style-type: none;/*去掉列表的點*/
					padding:0;/*清空內部邊距*/

				}
				.faceul li{
					width: 50px;
					height: 52px;
					border: 1px solid green;
					text-align: center;
					float: left;/*左浮動,橫向顯示*/
					margin-left: 5px;/*每個li的位置間隔*/		
					margin-top: 5px;
						}
			</style>
			<!-- 行數會自動增加 -->
			<ul class="faceul">
				<li>第一列</li>
				<li>第二列</li>
				<li>第三列</li>
				<li>第四列</li>
				<li>第五列</li>
				<li>第六列</li>
				<li>第七列</li>
				<li>第八列</li>
				<li>第九列</li>
				<li>第十列</li>
				<li>第十一列</li>
				<li>第十二列</li>
				<li>第十三列</li>
			</ul>



發佈了42 篇原創文章 · 獲贊 5 · 訪問量 2萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章