0314-布局遇到的问题（山东理工大）

注意事项：

布局：先用色块把整体布好。
id:唯一的（重复也不会错，同样的css可以加标号）
img:宽度和高度只设置一种，避免被拉伸

已解决：

兼容问题：什么时候该用绝对数值，什么时候用百分比，宽和高各怎么设等等都不太清楚，导致有点混乱，缩放时位置会移动。

解决方法：如果是屏幕宽度的div，先设一个100%的div，再套一个固定宽度的div，固定宽度里面的其他内容宽度可用百分比。

总结起来就是：大的div固定宽度，里面用百分比。

1.用图片做列表前缀可能会和文字不平齐，可以用背景图片的方法，再用背景图片的定位调整位置。

2.背景图片的居中：background-position：center（50%） center（50%）

3.宽度固定内容太挤的话缩放时可能自动换行

4.line-height设置单行垂直居中

5.设置一个只包含浮动元素的div时，如果下面还有其他内容，一定要给div固定高度。

6. 给整个页面设置（左）边距的时候是body{}而不是*{}，要设置padding而不是margin

7. padding值不能为负

8.行内标签不能通过text-align;center实现文字居中，因为本身的长度是跟随内容的长度

9.对a和div的标签组合设置:hover：可直接通过a标签控制；如果通过div控制，需将div放到a标签里面

10.如果要图片不随缩放而改变，图片所在的div和图片本身都不要设高。如果只给div设高，图片不会改变，但会遮盖下面内容，如果也给图片设高，高度会缩放。

转载于:https://www.cnblogs.com/flypea93/p/8570341.html