《
CSS布局的一些小经验》文章地址：http://www.tfxk.com/wangyesheji/jianzhanjingyan/03023335R013.htm
--> [
网站建设之]CSS布局的一些小教训
1.在一个div内嵌套两个div.
<div id="1">
<div id="2"></div>
<div id="3"></div>
</div>
css
#1 { width:100%;background:blue,
CSS布局口诀;}
#2 { width:100%;background:red;}
#3 { width:100%,
CSS属性选择器的四种格式;background:green;}
当div2,3里面不异样的内容的时候，显示所有畸形，然而当Div3里放一个超过屏幕宽度的图片时,
CSS属性选择器制作个性化链接样式，div1会主动扩大，但是div2不会,
CSS属性的缩写。这就使得显示很丢脸。假如用表格，div2跟div3分辨是两个tr，那么不存在这个问题。
这个问题怎么解决？
2. 左中右三个div
<div id="left "><,
CSS属性Vertical Align使用方法讲解;/div>
<div id="right "></div>
<div id="center "></div>,
CSS将图像设置为背景;
css
#left {float:left; position:relative; width:200px; left:0px,
CSS实用表格示例(带注释);background: red;}
#right {float:right; position:relative; width:200px; right:0px;background: green;}
#center{margin-left:200px,
CSS实用技巧18招; margin-right:200px; position:relative; display:block; height:1%;background: blue;}
这是一个很简略的左右侧固定中间自适应布局。
但是同样，你在center div里放一个超大的图片，看看会怎么样？中间一片白，centerdiv被挤到下面去了
用table,一行3个td就解决了这个问题。右侧的td会被挤到屏幕外面，但是总体布局不会乱
用div+css布局确实好，我减少了我的网站至少60%的html。
但是div在自适应和异常处理上面，我没找到好的的办法。
当然，有的人可能说，为什么要放一个超大的图片？我的答复是，这是用户输入。我是做程序出生，对软件来说，你永远也设想不到用户会输入什么样的数据.....所以咱们的软件/页面的容错性必需要好。Table，就我目前看来,
css实现鼠标经过图片显示边框的代码，在容错这个问题上，远好于div
愿望有高人能解决我这个问题。
在这个问题上，我盼望到达的后果就是，当旁边列超宽的时候，能把右列挤到屏幕以外去，但依然坚持程度的布局关联，不要错开。
问题3：高度的自适应
仍是三列（或两列）的布局。在不斟酌有什么超大的图片的情形下。是比拟轻易实现宽度自适应的布局的。但是如果左/中/右的背风景不一样怎么办？如何实现看起来各栏的高度是一样的？当然，有解决方式，我会,
CSS实现鼠标滑过表格变色，但是，如果不是背景色，是垂直平铺的背景图片怎么办？如何实现三栏（或两栏）的背景高度看起来是一致的？
请别探讨在后盾怎么处置的问题了，我想晓得的就是，这多少个问题，在不必表格布局的条件下，用Div+CSS能不能实现，而且至少要保障IE+FF的兼容性（能够是不同的CSS文件）。 Tag：CSS布局 经验 CSS布局 经验
(责任编辑：网站建设)
CSS布局的一些小经验相关文章