html中的<ul>和<li>標簽常常用來創建無序列表,但實際上他們還有一個很好的應用:創建方塊。
首先,我們需要使用<ul>標簽包裹<li>標簽。接著,我們需要給<li>標簽一個寬度和高度,以便創建一個正方形或矩形的形狀。最后,我們需要使用CSS來設置邊框和背景顏色,以使這個<li>標簽看起來像一個完整的方塊。
<ul> <li style="width:100px;height:100px;border:1px solid #ccc;background-color:#fff"></li> <li style="width:100px;height:100px;border:1px solid #ccc;background-color:#fff"></li> <li style="width:100px;height:100px;border:1px solid #ccc;background-color:#fff"></li> </ul>
在上面的代碼中,我們創建了一個包含3個正方形的列表。每個正方形的寬度和高度都為100像素,邊框為1像素的灰色,背景顏色為白色。我們可以根據需要更改這些屬性,以創建不同大小和顏色的方塊。
使用<ul>和<li>標簽創建方塊是一種簡單而靈活的方法,適用于許多不同的web開發場景。
上一篇html 瀏覽器寬高設置
下一篇css3繞中點旋轉