|
马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。
您需要 登录 才可以下载或查看,没有帐号?立即注册
x
使页面的字体变得更漂亮,更容易编排,使页面真正赏心悦目。
1.在一个div内嵌套两个div.
<divid="1">
<divid="2"></div>
<divid="3"></div>
</div>
CSS
#1{width:100%;background:blue;}
#2{width:100%;background:red;}
#3{width:100%;background:green;}
当div2,3内里没有非常的内容的时分,显现统统一般,可是当Div3里放一个凌驾屏幕宽度的图片时,div1会主动扩大,可是div2不会。这就使得显现很丢脸。假如用表格,div2和div3分离是两个tr,那末不存在这个成绩。
这个成绩怎样办理?
2.左中右三个div
<divid="left"></div>
<divid="right"></div>
<divid="center"></div>
css
#left{float:left;position:relative;width:200px;left:0px;background:red;}
#right{float:right;position:relative;width:200px;right:0px;background:green;}
#center{margin-left:200px;margin-right:200px;position:relative;display:block;height:1%;background:blue;}
这是一个很复杂的摆布侧流动两头自顺应结构。
可是一样,你在centerdiv里放一个超年夜的图片,看看会怎样?两头一片白,centerdiv被挤到上面往了
用table,一行3个td就办理了这个成绩。右边的td会被挤到屏幕表面,可是整体结构不会乱
用div+css结构切实其实好,我削减了我的网站最少60%的html。
可是div在自顺应和非常处置下面,我没找到好的的办法。
固然,有的人大概说,为何要放一个超年夜的图片?我的回覆是,这是用户输出。我是做程序出生,关于软件来讲,你永久也设想不到用户会输出甚么样的数据.....以是我们的软件/页面的容错性必需要好。Table,就我今朝看来,在容错这个成绩上,远好过div
但愿有高人能办理我这个成绩。
在这个成绩上,我但愿到达的效果就是,傍边间列超宽的时分,能把右列挤到屏幕之外往,但仍旧坚持程度的结构干系,不要错开。
成绩3:高度的自顺应
仍是三列(或两列)的结构。在不思索有甚么超年夜的图片的情形下。是对照简单完成宽度自顺应的结构的。可是假如左/中/右的背景致纷歧样怎样办?怎样完成看起来各栏的高度是一样的?固然,有办理办法,我会,可是,假如不是背景致,是垂直平展的背景图片怎样办?怎样完成三栏(或两栏)的背景高度看起来是分歧的?
请别会商在背景怎样处置的成绩了,我想晓得的就是,这几个成绩,在不必表格结构的条件下,用Div+CSS能不克不及完成,并且最少要包管IE+FF的兼容性(能够是分歧的CSS文件)。</p>
在几乎所有的浏览器上都可以使用。15.以前一些非得通过图片转换实现的功能,现在只要用CSS就可以轻松实现,从而更快地下载页面。 |
|