html中有序列表ol中的li前面不顯示數字

2021-10-02 21:04:33 字數 772 閱讀 6996

最近做專案遇到這樣乙個問題,就是前端想用ol有序列表,以此達到顯示每個li元素的前面的數字,但是在使用layui框架之後,數字無法顯示。如圖(注:這是在引入layui.css檔案之後的樣子):

首先,這個問題一定是引入的css檔案修飾了原來的樣式,所以要增加新的樣式覆蓋掉引入的css檔案的樣式,而我們自定義的樣式一定要寫在外部引入css檔案的之後

直接上**:

這是css**

ol li
這是html**

"margin-left: 20px;"

>

第乙個li<

/li>

第二個li<

/li>

第三個li<

/li>

<

/ol>

效果圖如下:

解釋:就兩點,第乙個就是要設定lilist-style的樣式,由於layui.css檔案是設為none的,這裡覆蓋就行了;第二點就是要給ol元素乙個左邊距,否則序號無法顯示出來。

補充:為什麼想起來用ol?

主要是因為在增刪元素的時候,li元素前面的序號可以做出及時的改變,不用自己再去處理

html 中的LI標籤

2011 07 22 20 10 9397人閱讀 收藏舉報 html cssfloat class 文件瀏覽器 第一步 編寫橫向選單的html 架構 請將以下 新增到html文件的導航欄區域中。第二步 編寫css 1 設定公共樣式 請將以下css 新增到html文件的 標籤範圍中。大家都知道,好了,...

html5 有序列表ol的一些變化

在html4中type 被list style type給替代了,start 和value幾乎不常用,很少看到有這樣的 但是html5的新標準這幾個屬性又重新被撿回來了。1 個人感覺使用type 屬性list style type 簡單,也容易記憶 下面來對應下這兩個之間的關係 type list ...

html5 有序列表ol的一些變化

在html4中type 被list style type給替代了,start 和value幾乎不常用,很少看到有這樣的 但是html5的新標準這幾個屬性又重新被撿回來了。1 個人感覺使用type 屬性list style type 簡單,也容易記憶 下面來對應下這兩個之間的關係 type list ...