CSS實(shí)例:list-style-type在IE與FF中奇怪的現(xiàn)象解析_DIV+CSS實(shí)例
教程Tag:暫無Tag,歡迎添加,賺取U幣!
我們看看list-style-type在IE與FF中希奇的現(xiàn)象解析,我們看下面的代碼: 經(jīng)典論壇原文
[ 可先修改部分代碼 再運(yùn)行查看效果 ]
我們來看問題出在哪里:
第一個問題是因?yàn)闆]有定義list-style-position,所以在FF下面列表預(yù)設(shè)標(biāo)記無法顯示。
第二個問題是由于沒有定義A的寬度,塊元素寬度默認(rèn)為整行,所以把整個li都突出有背景色了。
我們進(jìn)行相應(yīng)的修改。增加了:list-style-position: inside ;屬性。
看下面的運(yùn)行效果:
[ 可先修改部分代碼 再運(yùn)行查看效果 ]
我們在IE中瀏覽沒有什么問題了,但在FF中我們發(fā)現(xiàn)。鏈接文字消失了,我們將A元素不設(shè)置為塊元素,此問題消失。原因未解:
[ 可先修改部分代碼 再運(yùn)行查看效果 ]
代碼調(diào)試框 [m.dounai2.com]
[ 可先修改部分代碼 再運(yùn)行查看效果 ]
示例代碼 [m.dounai2.com]
1、不知道為什么,以下這段代碼的列表樣式(list-style-type:circle;)在 ff 怎么也不顯示,但在 ie 中顯示正常。
2、display:block 在 ff 下顯示是正常的,突出顯示部分(background-color: red;})僅加亮了字體。但在 ie 下卻把整個 li 都突出顯示了。
2、display:block 在 ff 下顯示是正常的,突出顯示部分(background-color: red;})僅加亮了字體。但在 ie 下卻把整個 li 都突出顯示了。
我們來看問題出在哪里:
第一個問題是因?yàn)闆]有定義list-style-position,所以在FF下面列表預(yù)設(shè)標(biāo)記無法顯示。
第二個問題是由于沒有定義A的寬度,塊元素寬度默認(rèn)為整行,所以把整個li都突出有背景色了。
我們進(jìn)行相應(yīng)的修改。增加了:list-style-position: inside ;屬性。
看下面的運(yùn)行效果:
代碼調(diào)試框 [m.dounai2.com]
[ 可先修改部分代碼 再運(yùn)行查看效果 ]
我們在IE中瀏覽沒有什么問題了,但在FF中我們發(fā)現(xiàn)。鏈接文字消失了,我們將A元素不設(shè)置為塊元素,此問題消失。原因未解:
代碼調(diào)試框 [m.dounai2.com]
[ 可先修改部分代碼 再運(yùn)行查看效果 ]
相關(guān)DIV+CSS實(shí)例:
- 固定div容器的寬高,圖片居中(圖片不限制大小)
- 用css制作有滾動條的居中彈出框
- 鼠標(biāo)指住(hover)變色的按鈕演示demo
- 10個很酷的涂鴉風(fēng)格國外網(wǎng)店設(shè)計(jì)展示
- jquery模擬瀏覽器滾動條效果
- 仿谷歌google的搜索框下拉提示列表效果
- JS顯示網(wǎng)頁最后更新時(shí)間
- CSS技巧:text-indent隱藏文字(以圖換字)
- CSS實(shí)例:三列自適應(yīng)等高且中列寬度自適應(yīng)
- DivCSS布局實(shí)例:很實(shí)用的圖文混排CSS列表-富有語義
- DivCSS實(shí)例:CSS菜單Flash效果用圖片模擬實(shí)現(xiàn)
- DivCSS布局實(shí)例用dldtdd來制作列表
DIV+CSS實(shí)例Rss訂閱Div+Css教程搜索
DIV+CSS實(shí)例推薦
- CSS布局的8個你需要掌握的技巧
- DIV CSS網(wǎng)頁布局分析的兩個小例子
- CSS實(shí)例教程:UL制作CSS橫向菜單藍(lán)綠色調(diào)
- DivCSS布局實(shí)例:很實(shí)用的圖文混排CSS列表-富有語義
- DIV CSS布局入門示例(三)頁面頂部制作
- DIV CSS布局入門示例(五)border和clear
- CSS布局教程:DIV CSS三列式布局的實(shí)現(xiàn)方法
- 鼠標(biāo)指住(hover)變色的按鈕演示demo
- CSS菜單:由CSS滑動門技術(shù)實(shí)現(xiàn)的菜單十一款
- DivCSS布局實(shí)例:詳解建立Flash上面浮動層
- 相關(guān)鏈接:
復(fù)制本頁鏈接| 搜索CSS實(shí)例:list-style-type在IE與FF中奇怪的現(xiàn)象解析
- 教程說明:
DIV+CSS實(shí)例-CSS實(shí)例:list-style-type在IE與FF中奇怪的現(xiàn)象解析。