H5css3的文本属性

Posted 2021-11-28 txf-123

1. 文本属性 text

Text-align

Text-decoration

Text-indent 文本缩进

Text-shadow 文本阴影

Text-shadow:x轴偏移距离 y轴上偏移距离 r阴影范围 color 阴影的颜色；

X和y可以为负数 x为负 向左偏 y为负 向上偏

Text-overflow  文本溢出 怎么显示内容

Text-overflow:ellipsis; 超出的以省略号形式显示出来

但是这个属性必须配合overflow:hidden;white-space:nowrap;一起使用

三者都不能少

Text-justify:

Justify 对齐 一般是两端对齐

Text-wrap:规定文本的换行规则

浏览器不支持

Word-wrap:break-word

Word-break:break-word;

浏览器对于英文单词，是这样解释的，如果单词之间没有空格，浏览器就会默认这是一个单词，即使超出了默认不换行，加了这两个属性中的任何一个，一旦单词超了，即使是一个单词也要换行。

1. box-shadow 给元素周边添加阴影，和text-shadow的用法相同。

4.浏览器的区别

移动端，安卓内置chrome浏览器，不需要考虑一些兼容性。但是再pc上考虑。

C3的这些新增属性ie，火狐等不兼容，因为各个浏览器内核不一样，针对这种内核，c3给元素属性前面加上对应的前缀比如

Ie   -ms-text-shadow{}

Chrome  -webkit-text-shadow

Firefox   -moz-text-shadow

opera   -o-text-shadow