CSS3文本效果

CSS3 text-justify 属性

text-justify 属性规定当 text-align 被设置为 text-align 时的齐行方法。
只有 Internet Explorer 支持 text-justify 属性。

语法
text-justify: auto|inter-word|inter-ideograph|inter-cluster|distribute|kashida|trim;
描述
auto 浏览器决定齐行算法。
none 禁用齐行。
inter-word 增加/减少单词间的间隔。
inter-ideograph 用表意文本来排齐内容。
inter-cluster 只对不包含内部单词间隔的内容(比如亚洲语系)进行排齐。
distribute 类似报纸版面,除了在东亚语系中最后一行是不齐行的。
kashida 通过拉伸字符来排齐内容。

点击这里进行测试

text-overflow 属性

text-overflow 属性规定当文本溢出包含元素时发生的事情。
所有主流浏览器都支持 text-overflow 属性。

语法
text-overflow: clip|ellipsis|string;
描述
clip 修剪文本。
ellipsis 显示省略符号来代表被修剪的文本。
string 使用给定的字符串来代表被修剪的文本。

点击这里测试

CSS3text-shadow 属性

text-shadow 属性向文本设置阴影。
注释:Internet Explorer 9 以及更早版本的浏览器不支持 text-shadow 属性。

语法
text-shadow: h-shadow v-shadow blur color;

注释:text-shadow 属性向文本添加一个或多个阴影。该属性是逗号分隔的阴影列表,每个阴影有两个或三个长度值和一个可选的颜色值进行规定。省略的长度是 0。

描述
h-shadow 必需。水平阴影的位置。允许负值。
v-shadow 必需。垂直阴影的位置。允许负值。
blur 可选。模糊的距离。
color 可选。阴影的颜色。

点击这里进行测试

CSS3 word-break 属性

word-break 属性规定自动换行的处理方法。
所有主流浏览器都支持 word-break 属性。

语法
word-break: normal|break-all|keep-all;
描述
normal 使用浏览器默认的换行规则。
break-all 允许在单词内换行。
keep-all 只能在半角空格或连字符处换行。

CSS3 word-wrap 属性

word-wrap 属性允许长单词或 URL 地址换行到下一行。
所有主流浏览器都支持 word-wrap 属性。

语法
word-wrap: normal|break-word;
描述
normal 只在允许的断字点换行(浏览器保持默认处理)。
break-word 在长单词或 URL 地址内部进行换行。
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • CSS3 文本效果 CSS3中包含几个新的文本特征。在本章中您将了解以下文本属性: text-shadow 属性...
    鹿守心畔光阅读 704评论 0 4
  • 1、 文本阴影 text-shadow向标题添加阴影: 2、 word-wrap自动换行 实例允许对长单词进行拆分...
    safiriGitHub阅读 355评论 0 0
  • 选择qi:是表达式 标签选择器 类选择器 属性选择器 继承属性: color,font,text-align,li...
    love2013阅读 2,331评论 0 11
  • 选择qi:是表达式 标签选择器 类选择器 属性选择器 继承属性: color,font,text-align,li...
    wzhiq896阅读 1,798评论 0 2
  • 前几天陪姐去买衣服,出门的时候我姐坚定的说半小时必须买到衣服,妈妈质疑了一句:这么短时间怎么可能买到喜欢的衣服?!...
    ToBeMself阅读 211评论 2 0