ul标签 ie7,ie8兼容怎么搞_html/css_WEB-ITnose
- WBOY原创
- 2016-06-24 12:25:301116浏览
ul标签 ie7,ie8兼容怎么搞，为什么ie7的高度会高些啊？？、不要使用 。。。
代码如下：
<!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> <title></title><style type="text/css"> a:link { text-decoration: none; } a:visited { text-decoration: none; } a:hover { text-decoration: underline; } a:active { text-decoration: none; } .cs-north-bg { width: 100%; height: 100%; background: url(themes/gray/images/header_bg.png) repeat-x; } .cs-north-logo { height: 40px; margin: 15px 0px 0px 5px; display: inline-block; color: #000000; font-size: 22px; font-weight: bold; text-decoration: none; } .ui-skin-nav { float: right; padding: 0; margin-right: 10px; list-style: none outside none; height: 30px; } .ui-skin-nav .li-skinitem { float: left; font-size: 12px; line-height: 30px; margin-left: 10px; text-align: center; vertical-align: bottom; } .ui-skin-nav .li-skinitem span { cursor: pointer; width: 10px; height: 10px; display: inline-block; vertical-align: bottom; } .ui-skin-nav .li-skinitem span.cs-skin-on { border: 1px solid #FFFFFF; } .ui-skin-nav .li-skinitem span.gray { background-color: gray; } .ui-skin-nav .li-skinitem span.pepper-grinder { background-color: #BC3604; } .ui-skin-nav .li-skinitem span.blue { background-color: blue; } .ui-skin-nav .li-skinitem span.cupertino { background-color: #D7EBF9; } .ui-skin-nav .li-skinitem span.dark-hive { background-color: black; } .ui-skin-nav .li-skinitem span.sunny { background-color: #FFE57E; } .ui-div-clock { float: right; padding: 0; margin-right: 10px; list-style: none outside none; height: 30px; } </style></head><body><div class="cs-north-bg" style="background: #293955;"> <div class="cs-north-logo"> 模板</div> <ul class="ui-skin-nav"> <li class="li-skinitem" title="gray"><span class="gray" rel="gray"></span></li> <li class="li-skinitem" title="pepper-grinder"><span class="pepper-grinder" rel="pepper-grinder"> </span></li> <li class="li-skinitem" title="blue"><span class="blue" rel="blue"></span></li> <li class="li-skinitem" title="cupertino"><span class="cupertino" rel="cupertino"></span> </li> <li class="li-skinitem" title="dark-hive"><span class="dark-hive" rel="dark-hive"></span> </li> <li class="li-skinitem" title="sunny"><span class="sunny" rel="sunny"></span></li> </ul> </div></body></html> 回复讨论(解决方案)
.cs-north-logo { height: 40px; margin: 15px 0px 0px 5px; display: inline-block; color: #000000; font-size: 22px; font-weight: bold; text-decoration: none; } 这个里面的display=inline-block，ie7和ie7之前的版本，是没有这个属性的
浏览器对于不识别的属性，都是不作处理的，所以使用了它默认的属性，所以你那边模板的模块，是以块级元素显示的。
所以会换行了。。。
你可以让它向左浮动。
声明：
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn