CSS排版小结

CSS排版小结

1. 元素对齐

• 垂直对齐：使用vertical-align:middle，实际上指元素的中位线对齐，一般在使用icon与文字并排对齐时非常实用。
• 水平对齐：元素与页面或父元素的两端距离相等，可以使用margin:auto来使其对齐。

2.消除浮动

有时会出现父元素未设置高度，而子元素跑出父元素外，未将父元素撑起的情况，此时需要消除浮动，一般使用clear="both"来解决。

3.缩放页面时排版错位

有时缩放页面，会看到原本排版正确的元素出现了错位，有些会跑出原本的范围，有些则完全错乱。这种情况一般是设定宽度或高度时没有使用百分比，使用了给定的px。可以换用百分比表示高度宽度等。