[css]再「li」前強制加入符號

Posted on 由
LINEで送る
[`evernote` not found]

剛開始是因為在wordpress的預設css中
會在所有的li的前面加上「>>」的符號
讓人看的蠻不舒服的
可是在順便也就解決的wp的中又看不出啥所以然
所以就一直把這件事往後移了
剛好現在需要在我自定的「ol」中加入這樣的效果
比如在所有備註的數字前面都再加入「※」這符號
最後找了一些關於css中counter-increment跟content的設定
完成了這段code：

ol.olremark{
    font-size: small;
    counter-reset: olremark;
 
    margin: 0;
    margin-left: 5px 0 0px;
 
    text-indent: -2em !important;
	text-indent: 0;
}
 
ol.olremark li:before{
    counter-increment: olremark;
    content: '※' counter(olremark) ' ';
}
 
ol.olremark li{
	list-style-type: none !important;
	list-style-type: disc;
    list-style-image: none;
    list-style-position: outside;
 
    text-indent: -2em !important;
	text-indent: 0;
	margin:0 0 0 28px;
}

唯一有問題的就是IE6 ….
又是IE6!!!!
只好把它改成disc
捨棄了數字的排列….＠＠
還要注意content:的地方不能用counters必須用counter
不然ie6會把很多原本的css吃掉

當然也就順便解決了wp的疑惑
把style.css的

.entry ul li:before, #sidebar ul ul li:before {
content: "\00BB \0020";
}

拿掉後再換上自己希望的樣式就ok了

2 則迴響於《[css]再「li」前強制加入符號》

回應已關閉。