当前位置：首页 >> 学院首页 >> 网页设计 >> HTML/XHTML >>

Firefox与IE下UL预设标记的异同

At: 2007-03-31 21:33 By: master8

小毅的blog：http://andymao.com/andy/

列表UL或是OL中都有一个预设标记，这个标记可能是实点圆点，也可能是数字。在实际的应用中，我们需要去掉这个预设标记，但我们不清楚这个预设标记是存在于什么位置。因为IE与FF似乎在处理UL的预设标记时都有着不同的方式：我们来写一个UL的HTML代码结构：

HTML结构：

建设部通报八起房地产交易违法、违规典型案例

周小川表态引发美元震荡|人民币应成世界货币?

首都机场一香港乘客制造炸弹威胁导致航班延误

美国房市“麻烦”未了|底特律房子比车子便宜

网络报告:美国是黑客大本营中国是最大受害国

代码框
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta http-equiv="Content-Language" content="zh-CN" /> <title>Firefox与IE下UL预设标记的异同</title> </head> <body> <ul> <li>建设部通报八起房地产交易违法、违规典型案例 </li> <li>周小川表态引发美元震荡|人民币应成世界货币?</li> <li>首都机场一香港乘客制造炸弹威胁导致航班延误</li> <li>美国房市“麻烦”未了|底特律房子比车子便宜</li> <li>网络报告:美国是黑客大本营中国是最大受害国</li> </ul> </body> </html>

这个UL在不同的浏览器中的显示基本上是差不多的。那么我们设定一下CSS试着看一下IE与FF什么地方不一样：

CSS代码：

ul {background:#ddd; padding:0; }

代码框
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta http-equiv="Content-Language" content="zh-CN" /> <title>Firefox与IE下UL预设标记的异同</title> <style type="text/css"> /*<![CDATA[*/ ul {background:#ddd; padding:0; } /*]]>*/ </style> </head> <body> <ul> <li>建设部通报八起房地产交易违法、违规典型案例 </li> <li>周小川表态引发美元震荡|人民币应成世界货币?</li> <li>首都机场一香港乘客制造炸弹威胁导致航班延误</li> <li>美国房市“麻烦”未了|底特律房子比车子便宜</li> <li>网络报告:美国是黑客大本营中国是最大受害国</li> </ul> </body> </html>

现在只把padding的值设为0，这时我们看一下IE中除了多个背景之外并没有什么变化，但是FF中的预设标记不见了！这里要注意的是IE中的预设标记是在背景外的。我们再来换个方式来设置：

CSS代码：

ul {background:#ddd; margin:0; }

代码框
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta http-equiv="Content-Language" content="zh-CN" /> <title>Firefox与IE下UL预设标记的异同</title> <style type="text/css"> /*<![CDATA[*/ ul {background:#ddd; margin:0; } /*]]>*/ </style> </head> <body> <ul> <li>建设部通报八起房地产交易违法、违规典型案例 </li> <li>周小川表态引发美元震荡|人民币应成世界货币?</li> <li>首都机场一香港乘客制造炸弹威胁导致航班延误</li> <li>美国房市“麻烦”未了|底特律房子比车子便宜</li> <li>网络报告:美国是黑客大本营中国是最大受害国</li> </ul> </body> </html>

分类:HTML/XHTML

阅读:138

评论:0

论坛精华

网站运营

站长学院

文章订阅

九州未来科技提供服务器支持 | 网站空间 | 虚拟主机