浮动
- 要善于利用浮动，浮动使得元素形成新的一致的流动方向，方便布局
- 设置元素浮动的常见套路：给子元素设置浮动，给父元素加清浮动的相关样式（防止一些浮动带来的特殊效果）
元素的宽高
- 尽量不要给元素的样式加height 和width, 这会造成很多麻烦，尽量用内部元素和padding填充
- 一个元素的高度由内容决定，块级元素的高度由其内部文档流元素的高度总和决定
- 文档流：文档内元素的流动方向，内联元素从左往右流，块级元素：每一个块都占一行，从上往下流动
- 给内联元素设置宽高不起作用，margin-top和margin-bottom不起作用,有时会根据需要选择display:inline-block,但要尽量避免这么做
字体设置常识
- 文字的居中不是让两个字的中线居中，而是基线对齐
- 不同字体的建议行高不一样
- 设置line-height 与宽度相当可以满足大部分文字居中的要求
- 根据中英文习惯，设置单词或文字换行可以采用如下规则：
中文 word-break:break-all
英文 word-break:word-break - 文字的居中不是让两个字的中线居中，而是基线对齐,
不同字体的建议行高不一样
padding
父元素 加padding 并不影响子元素的宽度，给父元素加padding 可能会使父元素变胖，所以一般会在父元素内再写一个div来加padding ,这样就避免了父元素的变形
网友评论