CSS 段落/换行/缩进

CSS 段落/换行/缩进

1.盒模型

box-sizing: content-box|border-box|inherit;

content-box（默认） ：
          实际宽度/高度 = width/height（元素内容大小） + padding + border 

border-box： 
         width/height  = 元素内容大小 + padding + border

　　　　　实际宽度/高度 = width/height = margin 

2.换行

　　 1.<br />
　　2.<p>标签来实现换行
　　3.CSS设置宽度自动换行：对于连续的数字和英文则无效。
　　4.连续英文字母及数字换行使用CSS换行。使用word-wrap:break-word与word-break:break-all

　　　　word-wrap:break-word与word-break:break-all共同点是都能把长单词强行断句，

　　　　word-wrap:break-word：会首先起一个新行来放置长单词，新的行还是放不下这个长单词则会对长单词进行强制断句；

　　　　word-break:break-all：则不会把长单词放在一个新行里，当这一行放不下的时候就直接强制断句了

　　 ps：CSS3中将word-wrap改名为overflow-wrap； 

3.不换行

 white-space:nowrap;

 

扫描二维码关注公众号，回复： 8483412 查看本文章