HTMLタグを水平または垂直に中央に設定する2つのスキームは、IE 6以外は互換性があります.
2167 ワード
<style>
/* HTML CSS */
div,img,p,ul,ol,dl,li,dt,dd,h1,h2,h3,h4,h5,h6,span,p,a,sub,sup,strong,em,label,header,footer,nav,menu,aside,figure,figcaption,section,article,time,address,hgroup{margin:0px;padding:0px;}
ul,ol,li{list-style-type:none;}img{border:none;}
h1,h2,h3,h4,h5,h6,sub,sup{font-weight:normal;font-size:12px;}
a{text-decoration:none;color:#333;}a:hover{text-decoration:underline;color:#CC0000;}
body{font-family:Tahoma, Geneva, sans-serif, 'Microsoft Yahei'}
b,strong{font-weight:normal;}em,i,cite{font-style:normal;}
/**
* IE7-IE10 FF Chrome Sarfiar
*
* IE6 boxc-r _margin-left: /2
* : a , text-align:center;
*/
.jz .jz-r,.jz .jz-l,.jz .jz-t,.jz .jz-b,.jz .jz-rl,.jz .jz-tb{position:relative;}.jz{position:absolute;}
.jz .jz-r,.jz .jz-rl{float:left;left:50%;}.jz .jz-l,.jz .jz-tb{left:-50%;}
.jz .jz-t,.jz .jz-b,.jz .jz-rl{top:50%;}.jz .jz-tb{top:-50%;}
.f1-btn2 li{display:inline;float:left;cursor:pointer;width:10px;height:10px;margin-left:3px;text-indent:-99999px;border-radius:5px;background-color:#C5C5C5;overflow:hidden;}
.f1-btn2 .f1-on{background-color:#6EBEB0;}
</style>
<div style=" width:940px;margin:0px auto;">
<div class="w940 jz" style="background:red;width:940px;height:20px;">
<div class="jz-r" style="_margin-left:-180px;">
<ul class="jz-l f1-btn2" >
<li class="f1-on"></li>
<li>1</li>
<li>2</li>
<li>1</li>
<li>1</li>
<li>1</li>
<li>1</li>
<li>1</li>
<li>1</li>
<li>1</li>
<li>1</li>
<li>1</li>
<li>1</li>
<li>1</li>
<li>1</li>
<li>1</li>
<li>1</li>
<li>1</li>
<li>1</li>
</ul>
</div>
</div>
</div>