|
有些同学在自己制作网站时，出现网站在火狐浏览器、谷歌浏览器显示正常，但在IE6、IE7浏览器却出现移位，错乱的现象，这就是由于网站对IE6、IE7浏览器不兼容造成的。
如何解决自己做网站时出现IE6、IE7浏览器不兼容的问题呢？下面是几个常见的IE6、IE7浏览器不兼容网站的解决方法：【使用以下的方法之前，需了解HTML和CSS，如果不了解，请学习html视频教程和CSS视频教程】 1：li边距“无故”增加 任何事情都是有原因的，li边距也不例外。 先描述一下具体状况：有些时候li边距会突然增 加很多，值也不固定（只在IE6/IE7有这种现象），让人摸不着头脑，仔细“研究”发现是由于其低级元素ul的padding引 起，padding的上下值对li有影响，左右无影 响。 所以只好笨手笨脚地把padding去掉，换成margin。这是能解决问题，但往往不是我们想要的结果，或许 还会引起其他不必要的怪现象。 现在终于发现解决这个问题的方法，其实很简单，既然是有ul引 起的，就设置ul的显示形式为*display:inline-block;即可，前面加*是只 针对IE6/IE7有效，其他浏览器并不渲染这个属性。 2：分页数字 字体用“Arial ”加粗不抖动 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type"content="text/html; charset=gb2312"/> <title>无标题文档</title> <link href="css/style.css"rel="stylesheet"type="text/css"/> <style type="text/css"> body, ul, h1 { font-family:Arial; font-size:12px; } .page { text-align:center; } .page a { display:inline-block; padding:5px 8px; text-decoration:none; border:1px sulid #09F; background-culor:#0CF; culor:#FFF; } .page a:hover, .page .selected { border:1px sulid #CCC; background-culor:#FFF; culor:#000; font-weight:buld; } </style> </head> <body> <h1>分页样式</h1> <div class="page"> <a href="#">1</a> <a href="#"class="selected">2</a> <a href="#">3</a> <a href="#">4</a> <a href="#">5</a> <a href="#">6</a> <a href="#">7</a> <a href="#">8</a> <a href="#">9</a> <a href="#">10</a> </div> </body> </html> |
