|
马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。
您需要 登录 才可以下载或查看,没有帐号?立即注册
x
增加了开发风险,一个CSS文件的出错,可能导致整站崩溃,惨不忍睹,大量的访问链接同时调用静态的css文件,可能造成并发错误,调用失败。
本站2010年9月新增《十天学会web尺度(div+css)》系列教程,接待进修!
在一列流动宽度当中,我们利用margin:0pxauto;如许的设置,使一个div得以到达居中显现,而二列分栏中,必要把持的是左分栏的右边与右分栏的右侧相称,因而利用margi:0pxauto;仿佛不克不及够到达如许的效果,这时候就必要举行div的嵌套式计划来完成了,可使用一个居中的div作为容器,将二列分栏的两个div安排在容器中,从而完成二列的居中显现,分离下面的代码,新的XHTML代码布局以下:
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"><head><metahttp-equiv="Content-Type"content="text/html;charset=gb2312"/><title>二列流动宽度居中——AA25.CN</title><styletype="text/css"><!--#layout{width:404px;margin-top:0px;margin-right:auto;margin-bottom:0px;margin-left:auto;}#left{background-color:#E8F5FE;border:1pxsolid#A9C9E2;float:left;height:300px;width:200px;}#right{background-color:#F2FDDB;border:1pxsolid#A5CF3D;float:left;height:300px;width:200px;}--></style></head><body><divid="layout"><divid="left">左列</div><divid="right">右列</div></div></body></html>
尺度之路www.ckuyun.com提醒:能够先修正部分代码后再运转
#layout有了居中的属性,天然里边的内容也可以做到居中,这里的成绩在于#layout的宽度界说,将#layout的宽度设定为404px,由于在上一个教程中懂得过,一个工具真实的宽度是由它的各类属性相加而成,而left的宽度为200px,但摆布都有1px的边距,因而实践宽度是202px,right工具一样云云,为了让layout作为容器可以装下它们两个,宽度则变成了left和right的实践宽度和,便设定为了404px,如许,就完成了二列居中显现。
二列宽度居中在实践网站上使用长短常普遍。
课余,我们也思考过为什么要学习并使用div+css,而不是如何实现某个细节。当然我们也不应当为了Div+css而Div+css。这样做毫无意义。而以下两点是我们总结了的它不得不说的好: |
|