sofeien的专栏

用到了css3的transition属性，其实是从左往右扩展的。因为设置了块居中，产生从中心向左右扩展的感觉 #box{ background-color:gray; height:20px; overflow:hidden; } .a{ background-color:red; width:0; height:20px; margin: 0

*{margin:0;padding:0} .box { width:400px; height:200px; background-color:gray; text-align: center; } .middle{ paddin

*{margin:0;padding:0} .box { background-color:gray; } .box:before{ display: table; content: ''; }

white-space 的常用属性包括: normal nowrap pre pre-line pre-wrap normal: 自动处理换行，行中的空白符（空格、换行、TAB等）合并为1个小空格 nowrap: 不换行，行中的空白符（空格、换行、TAB等）合并为1个小空格 pre: 不自动处理换行，保留原内容的所有空白符（空格、换行、TAB等） pre-line: 自动处理换行，

word-break 可选属性为 normal | break-all | keep-all. normal: 中文：按字分行 英文：按单词分行 break-all:   中文：按字分行 英文：按字母分行 keep-all: （会导致中文排版异常） 中文：按标点符号分行 英文：按单词分行 演示：

word-wrap 属性可选值 normal | break-word normal: 单词长度超过容器宽度不换行，会导致宽度溢出 break-word: 单词长度超过容易宽度会换行，不会导致宽度溢出 注意： word-break word-wrap 都是对英文单词或长串数字起作用的，对中文没有影响 如果设置了word-break:break-all 那么word-warp也