html無序列表橫向排列 css ul li如何實(shí)現(xiàn),橫向排列?
css ul li如何實(shí)現(xiàn),橫向排列?讓使用浮動(dòng):左If無序列表有一個(gè)外邊距,即一個(gè)行軍值,然后同時(shí)使用float:left和display:inline。否則,瀏覽器兼容性將受到影響,IE6的外緣將
css ul li如何實(shí)現(xiàn),橫向排列?
讓
使用浮動(dòng):左If無序列表有一個(gè)外邊距,即一個(gè)行軍值,然后同時(shí)使用float:left和display:inline。否則,瀏覽器兼容性將受到影響,IE6的外緣將加倍。Display:inline可以單獨(dú)水平顯示,但是無序列表的寬度和高度將不起作用,也就是說,如果設(shè)置了Li,它將不起作用,因?yàn)镈isplay:inline是一種內(nèi)嵌樣式。
在DIV CSS中,讓無序列表橫向顯示,是用float:left還是用display: inline?
1. 創(chuàng)建新的TXT文檔并將其修改為“演示.html“HTML文件,如下圖所示。
2. 使用sublime編輯器打開HTML文件,以改進(jìn)HTML5標(biāo)準(zhǔn)代碼,如下圖所示。
3. 在body標(biāo)記中,編寫一組無序列表標(biāo)記。代碼如下圖所示。
4. 用瀏覽器打開HTML頁面,可以看到默認(rèn)情況下Li標(biāo)簽是垂直顯示的(Li是塊級元素),如下圖所示。
5. 我們可以為UL標(biāo)簽下的所有Li標(biāo)簽設(shè)置樣式“display:inline block”,以水平顯示多個(gè)Li標(biāo)簽。
6. 刷新界面后,會(huì)發(fā)現(xiàn)Li標(biāo)簽是水平顯示的。