兼容ie6/ff/ch/op的div+css实现的圆角框_html/css_WEB-ITnose

WBOY
Freigeben: 2016-06-24 12:27:07
Original
1114 Leute haben es durchsucht

 

<title>青春不迷茫:寻梦时代的“蚁族”逆袭之旅- 职场管理专题-中国人力资源开发网-中人网 - 中国领先的人力资源门户,最佳HR学习成长平台</title><meta name="Keywords" content="蚁族 青春 梦想"><meta name="Description" content="“蚁族”一词并非一种昆虫族群。“蚁族”收入不高、工作不稳定、生活条件非常差,他们从村里的金凤凰变成了城市中的边缘人,成了没有话语权的弱势群体。然而,“蚁族”又充满着青春与梦想,谁又没年轻过?实现梦想,完成蜕变,更是蚁族需要去面对与挑战的。"><meta content="text/html; charset=UTF-8" http-equiv="Content-Type"><style type="text/css">body {	color: black;	font-size: 12px;	margin: 0px;	padding: 0px;}img {	border: 0 none;}a {	color: blue;}a:hover {	color: gray;}div.bodyBox {	width: 960px;	margin: 0 auto;}.bgBox {	margin: 10px 0;	position: relative;	display: block;	zoom: 1;/*ie 触发haslayout*/}.bgBox .content {	border: 2px solid #a0a0a0;}.bgBox span.corner {	display: block;	position: absolute;	background-image: url("tpl/round.gif");	background-repeat: no-repeat;	background-color: white;	width: 10px;	height: 10px;	z-index: 2;}.bgBox .tl {	top: 0px;	left: 0px;}.bgBox .tr {	top: 0px;	right: 0px;	background-position: right 0;}.bgBox .bl {	bottom: 0px;	left: 0px;	background-position: bottom left;}.bgBox .br {	bottom: 0px;	right: 0px;	background-position: bottom right;}.bgBox .sideTop {	background: url(tpl/sideTop.gif) repeat-x 0 0;	zoom: 1;	z-index: 1;}.bgBox .sideBottom {	background: url(tpl/sideBottom.gif) repeat-x 0 bottom;	zoom: 1;	z-index: 1;}.bgBox .sideLeft {	padding: 25px;	background: url(tpl/sideLeft.gif) repeat-y left top;	zoom: 1;	z-index: 1;}.bgBox .sideRight {	background: url(tpl/sideRight.gif) repeat-y right top;	zoom: 1;	z-index: 1;}.bgBox .text {	color: yellow;}.w100p {	width: 100%;	display: block;	margin: 10px 0;}.clearfix:after {	content: ".";	display: block;	height: 0;	clear: both;	visibility: hidden;}.clearfix {	zoom: 1;}hr.clearHr {	clear: both;	float: none;	visibility: hidden;	width: 1px;	height: 1px;}div.titleDiv {	background: url("tpl/titleBG.jpg") no-repeat scroll 0 bottom transparent;	height: 65px;}div.titleDiv h1 {	margin-left: 100px;	font-weight: bold;	color: gray}h2.titleH2 a {	color: red!important;}h2.center {	text-align: center;}div.wh3 {	width: 290px;}div.wh2 {	width: 448px;}.floatLeft {	float: left;	margin-right: 10px;	display: block;}.floatRight {	float: right;	display: block;}</style><div class="bodyBox"> <img  src="tpl/round.gif" class="w100p"    style="max-width:90%" alt="兼容ie6/ff/ch/op的div+css实现的圆角框_html/css_WEB-ITnose" >  <div class="titleDiv">    <h1>这是标题标题</h1>  </div>  <!--线框-->  <div class="bgBox"> <span class="corner tl"></span><span class="corner tr"></span><span class="corner bl"></span><span class="corner br"></span>    <div class="sideTop">      <div class="sideBottom">        <div class="sideRight">          <div class="sideLeft">             <!--内容-->                         <span style="font-size:20px;font-weight:bold;">导语:</span>kkkk导语导语导语导语导语导语            kkkk导语导语导语导语导语导语            kkkk导语导语导语导语导语导语            kkkk导语导语导语导语导语导语            kkkk导语导语导语导语导语导语            kkkk导语导语导语导语导语导语            kkkk导语导语导语导语导语导语            kkkk导语导语导语导语导语导语            <p>                         kkkk导语导语导语导语导语导语              kkkk导语导语导语导语导语导语              kkkk导语导语导语导语导语导语              kkkk导语导语导语导语导语导语              kkkk导语导语导语导语导语导语              kkkk导语导语导语导语导语导语              kkkk导语导语导语导语导语导语              kkkk导语导语导语导语导语导语 </p>            <p>                         kkkk导语导语导语导语导语导语              kkkk导语导语导语导语导语导语              kkkk导语导语导语导语导语导语              kkkk导语导语导语导语导语导语              kkkk导语导语导语导语导语导语              kkkk导语导语导语导语导语导语              kkkk导语导语导语导语导语导语              kkkk导语导语导语导语导语导语 </p>                        <!--内容-->           </div>        </div>      </div>    </div>  </div>  <!--线框-->    <div class="titleDiv w100p">    <h1>这是标题标题</h1>  </div>  <!--线框-->  <div class="bgBox"> <span class="corner tl"></span><span class="corner tr"></span><span class="corner bl"></span><span class="corner br"></span>    <div class="sideTop">      <div class="sideBottom">        <div class="sideRight">          <div class="sideLeft">             <!--内容-->                        <div class="floatLeft wh3"> <img  src="tpl/round.gif"    style="max-width:90%"  style="max-width:90%" alt="兼容ie6/ff/ch/op的div+css实现的圆角框_html/css_WEB-ITnose" >              <h2 class="center"><a href="kk.htm">上市房价</a></h2>              <p> 每位评委 <a href="">【详细】</a> </p>            </div>            <div class="floatLeft wh3"> <img  src="tpl/round.gif"    style="max-width:90%"  style="max-width:90%" alt="兼容ie6/ff/ch/op的div+css实现的圆角框_html/css_WEB-ITnose" >              <h2 class="center"><a href="kk.htm">上市房价</a></h2>              <p> 每位评委 <a href="">【详细】</a> </p>            </div>            <div class="floatLeft wh3" style="margin-right:0px;"> <img  src="tpl/round.gif"    style="max-width:90%"  style="max-width:90%" alt="兼容ie6/ff/ch/op的div+css实现的圆角框_html/css_WEB-ITnose" >              <h2 class="center"><a href="kk.htm">上市房价</a></h2>              <p> 每位评委 <a href="">【详细】</a> </p>            </div>            <hr class="clearHr">                        <!--内容-->           </div>        </div>      </div>    </div>  </div>  <!--线框-->  <div class="titleDiv w100p">    <h1>这是标题标题</h1>  </div>  <!--线框-->  <div class="bgBox"> <span class="corner tl"></span><span class="corner tr"></span><span class="corner bl"></span><span class="corner br"></span>    <div class="sideTop">      <div class="sideBottom">        <div class="sideRight">          <div class="sideLeft">             <!--内容-->                         <img  src="tpl/round.gif"    style="max-width:90%"  style="max-width:90%"  class="floatLeft" alt="兼容ie6/ff/ch/op的div+css实现的圆角框_html/css_WEB-ITnose" >            <div class="floatLeft" style="width:500px;">              <h2><a href="kk.htm">上市房价</a></h2>              <p> 每位评委 <a href="">【详细】</a> </p>              <h2><a href="kk.htm">上市房价</a></h2>              <p> 每位评委 <a href="">【详细】</a> </p>              <h2><a href="kk.htm">上市房价</a></h2>              <p> 每位评委 <a href="">【详细】</a> </p>            </div>            <hr class="clearHr">                        <!--内容-->           </div>        </div>      </div>    </div>  </div>  <!--线框-->  <div class="titleDiv w100p">    <h1>这是标题标题</h1>  </div>  <!--线框-->  <div class="bgBox"> <span class="corner tl"></span><span class="corner tr"></span><span class="corner bl"></span><span class="corner br"></span>    <div class="sideTop">      <div class="sideBottom">        <div class="sideRight">          <div class="sideLeft">             <!--内容-->                        <div class="floatLeft wh2">              <div class="floatLeft" style="width:200px;">                <h2 class="center"><a href="">标题</a></h2>                <p> kkkkkkkkkk                  kkkkkkkkkk                  kkkkkkkkkk                  kkkkkkkkkk                  kkkkkkkkkk <a href="">【详细】</a> </p>              </div>              <img  src="tpl/round.gif"    style="max-width:90%"  style="max-width:90%" class="floatRight" alt="兼容ie6/ff/ch/op的div+css实现的圆角框_html/css_WEB-ITnose" >              <hr class="clearHr">              <div class="floatLeft" style="width:200px;">                <h2 class="center"><a href="">标题</a></h2>                <p> kkkkkkkkkk                  kkkkkkkkkk                  kkkkkkkkkk                  kkkkkkkkkk                  kkkkkkkkkk <a href="">【详细】</a> </p>              </div>              <img  src="tpl/round.gif"    style="max-width:90%"  style="max-width:90%" class="floatRight" alt="兼容ie6/ff/ch/op的div+css实现的圆角框_html/css_WEB-ITnose" >              <hr class="clearHr">            </div>            <div class="floatLeft wh2" style="margin-right:0;">              <div class="floatRight" style="width:200px;">                <h2 class="center"><a href="">标题</a></h2>                <p> kkkkkkkkkk                  kkkkkkkkkk                  kkkkkkkkkk                  kkkkkkkkkk                  kkkkkkkkkk <a href="">【详细】</a> </p>              </div>              <img  src="tpl/round.gif"    style="max-width:90%"  style="max-width:90%" class="floatLeft" alt="兼容ie6/ff/ch/op的div+css实现的圆角框_html/css_WEB-ITnose" >              <hr class="clearHr">              <div class="floatRight" style="width:200px;">                <h2 class="center"><a href="">标题</a></h2>                <p> kkkkkkkkkk                  kkkkkkkkkk                  kkkkkkkkkk                  kkkkkkkkkk                  kkkkkkkkkk <a href="">【详细】</a> </p>              </div>              <img  src="tpl/round.gif"    style="max-width:90%"  style="max-width:90%" class="floatLeft" alt="兼容ie6/ff/ch/op的div+css实现的圆角框_html/css_WEB-ITnose" >              <hr class="clearHr">            </div>            <hr class="clearHr">                        <!--内容-->           </div>        </div>      </div>    </div>  </div>  <!--线框-->  <div class="titleDiv w100p">    <h1>这是标题标题</h1>  </div>  <!--线框-->  <div class="bgBox"> <span class="corner tl"></span><span class="corner tr"></span><span class="corner bl"></span><span class="corner br"></span>    <div class="sideTop">      <div class="sideBottom">        <div class="sideRight">          <div class="sideLeft">             <!--内容-->                         <img  src="tpl/round.gif"    style="max-width:90%"  style="max-width:90%"  class="floatLeft" alt="兼容ie6/ff/ch/op的div+css实现的圆角框_html/css_WEB-ITnose" >            <div class="floatLeft" style="width:500px;">              <h2><a href="kk.htm">上市房价</a></h2>              <p> 每位评委 <a href="">【详细】</a> </p>              <h2><a href="kk.htm">上市房价</a></h2>              <p> 每位评委 <a href="">【详细】</a> </p>              <h2><a href="kk.htm">上市房价</a></h2>              <p> 每位评委 <a href="">【详细】</a> </p>              <h2><a href="kk.htm">上市房价</a></h2>              <p> 每位评委 <a href="">【详细】</a> </p>            </div>            <hr class="clearHr">                        <!--内容-->           </div>        </div>      </div>    </div>  </div>  <!--线框-->  <div class="titleDiv w100p">    <h1>这是标题标题</h1>  </div>  <!--线框-->  <div class="bgBox"> <span class="corner tl"></span><span class="corner tr"></span><span class="corner bl"></span><span class="corner br"></span>    <div class="sideTop">      <div class="sideBottom">        <div class="sideRight">          <div class="sideLeft">             <!--内容-->                        <div class="floatLeft wh3"> <img  src="tpl/round.gif"    style="max-width:90%"  style="max-width:90%" alt="兼容ie6/ff/ch/op的div+css实现的圆角框_html/css_WEB-ITnose" >              <h2 class="center"><a href="kk.htm">上市房价</a></h2>              <p> 每位评委 <a href="">【详细】</a> </p>            </div>            <div class="floatLeft wh3"> <img  src="tpl/round.gif"    style="max-width:90%"  style="max-width:90%" alt="兼容ie6/ff/ch/op的div+css实现的圆角框_html/css_WEB-ITnose" >              <h2 class="center"><a href="kk.htm">上市房价</a></h2>              <p> 每位评委 <a href="">【详细】</a> </p>            </div>            <div class="floatLeft wh3" style="margin-right:0px;"> <img  src="tpl/round.gif"    style="max-width:90%"  style="max-width:90%" alt="兼容ie6/ff/ch/op的div+css实现的圆角框_html/css_WEB-ITnose" >              <h2 class="center"><a href="kk.htm">上市房价</a></h2>              <p> 每位评委 <a href="">【详细】</a> </p>            </div>            <hr class="clearHr">                        <!--内容-->           </div>        </div>      </div>    </div>  </div>  <!--线框-->  <div class="titleDiv w100p">    <h1>结语</h1>  </div>  <!--线框-->  <div class="bgBox"> <span class="corner tl"></span><span class="corner tr"></span><span class="corner bl"></span><span class="corner br"></span>    <div class="sideTop">      <div class="sideBottom">        <div class="sideRight">          <div class="sideLeft">             <!--内容-->             编辑人员信息                         <!--内容-->           </div>        </div>      </div>    </div>  </div>  <!--线框--> </div>
Nach dem Login kopieren


 

round.gif

sideBottom.gif

sideLeft.gif

sideRight.gif

sideTop.gif




chrome

ff

ie6

op


 

Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage