前端样式属性（一）

***********************不太熟练的样式****************************

一、中英文换行

word-break

    break-all（以字母为单位换行）|break-word（以单词为单位换行）

white-space

    pre-wrap（只对中文强制换行）|nowrap（强制中文不换行）

参考文章

二、absolute和fixed的区别

这两个都是position定位中的属性，那么他们俩个有什么区别呢？

在于滚动条，没有滚动条，二者的效果是一样的。有滚动条之后absolute会随着滚动条滚动，而fixed不会随着滚动条移动。

相同点：都会脱离文档流

三、box-sizing的用法

正常的盒模型是content+padding+border+margin，优先内容（即内容如果超过框会将父级撑开）

box-sizing模型则是优先边框（即先固定边框，再填充内容，不管内容是否能放下）

有以下几个选值：

content-box（default），border-box，padding-box。

1. box-sizing:border-box;  
2. -moz-box-sizing:border-box; /* Firefox */  
3. -webkit-box-sizing:border-box; /* Safari */  

content-box，border和padding不计算入width之内

padding-box，padding计算入width内

border-box，border和padding计算入width之内，其实就是怪异模式了。

四、visibility: visible;

可见visible或弗成见hidden和这个属性类似的还有display:none;或display:block；两者差别就是一个会占用以前的地位display用法不会占位。

visible　元素可见。   
hidden　元素不可见。

五、content:''
清除浮动的时候，需要用content来占位。将容器撑开

六、transition-duration:0.3s;

动画延迟 是一种过渡的效果

七、transform

参考文章

八、transition

参考文章

 

 

 

 

 

 

*************************************************