|
解决hr分割线在IE中存在默认边距问题
方便在使用分割线的时候使用hr,尽量不使用border,语意化html
<!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" xml:lang="en" lang="en">
<head>
<title></title>
<style type="text/css">
<!--
*{ margin:0; padding:0; }
body{ font:12px/130% Verdana, Geneva, Arial, Helvetica, sans-serif 宋体; text-align:center; }
li{ list-style:none; }
.clearfix:after {content: ".";display: block;height: 0;clear: both;visibility: hidden;}
.clearfix{display:inline-block;}
.hr1{ height:1px;border:none;border-top:1px solid Black;margin:0;*margin:0 0 -14px 0;float:none;*float:left;display:block;}
.hr2{ height:2px;border:none;border-top:2px solid #C71585;margin:0;*margin:0 0 -14px 0;float:none;*float:left;display:block;}
.hr3{ height:3px;border:none;border-top:3px solid #6B8E23;margin:0;*margin:0 0 -14px 0;float:none;*float:left;display:block;}
div{ height:20px; background:#D3EDF8;}
-->
</style>
</head>
<body>
<div></div>
<hr class="hr1" />
<hr class="hr2" />
<hr class="hr3" />
<div></div>
</body>
</html>
|
