CSS的文本外观属性/color/letter-spacing/word-spaing/…/学习笔记

这篇博客详细介绍了CSS中的文本外观属性,包括color、letter-spacing、word-spacing、text-align、text-transform、text-decoration、text-indent、white-space、text-shadow、text-overflow和word-wrap。内容涵盖了这些属性的作用、取值及实际应用示例,帮助读者理解如何通过这些属性丰富文本效果和实现文本布局控制。
摘要由CSDN通过智能技术生成

CSS的文本外观属性

通过外观属性能使文本的效果更加丰富

color:

用于定义文本的颜色,可用预定义的颜色值如red,green或十六进制的颜色值,最后还能使用RGB颜色代码rgb(255,0,0)或rgb(100%,0,0)

letter-spacing:

用于定义字间距,即字符与字符之间的空白

word-spacing

英文字非常之间的字间距,对中文无效 word-spacing和letter-spacing取值范围可以是负数p{letter-spacing: -10px; line-height: 5em;}

text-align

用于设置文本内容的水平对齐:

left:左对齐
right:右对齐
center: 居中对齐

注意: text-align属性仅适用于块级元素,对行内元素是无效的,如果需要对图像设置水平对齐,可以为图像添加一个父标签,如<p>然后对父标签应用text-align属性

text-transform

用于控制英文字符的大小写转换

text-decoration

设置下划线、上划线、删除线等

none(清除装饰)
underline(下划线)
overline(上划线)
line-through(删除线)

text-indent

设置文本的首行缩进,一般使用em作为设置单位一般设置-2em表示首行缩进2个字符

white-space

设置空白符(空格,或多个空格),

normal(常规)

pre:预格式化,按照文档的书写格式保留空格,空行原样显示

nowrap:空格行无效,强制文本不能换行,除非遇到<br>换行标签,如若超出浏览器显示则浏览器会添加滑动条

text-shadow

是css3新增的属性,用于设置文本识别卡音影的距离

h-shadow:水平阴影距离的设置

v-shadow:垂直阴影距离的设置

blur:设置模糊半径

color:设置阴影颜色

text-overflow

用于处理溢出的文本修剪,需要配合white-space使用

clip:修剪溢出文本,而不显示省略号

ellipsis:用省略号显示溢出的文本

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值