CSS第四章——文本属性

一些学习笔记。

  • CSS Text(文本)属性可定义文本的外观,比如文本的颜色、对齐文本、装饰文本、文本缩进、行间距等。
属性表示注意点
color文本颜色通常使用十六进制 而且是简写形式#fff
text-align文本对齐可以设定文字水平的对齐方式
text-indent文本缩进通常用于段落首行缩进2个字的距离 text-indent:2em
text-decoration文本修饰添加下划线underline 取消下划线:none
line-height行高控制行与行之间的距离

4.1 文本颜色

  • color 属性用于定义文本的颜色。
div { 
 color: red;
}
  • 颜色表示形式
表示属性值
预定义的颜色值red,green,blue
十六进制#FF0000,#FF6600,#29D794
RGB代码rgb(255,0,0) 红色 或rgb(100%,0%,0%)

十六进颜色对应查询网站

4.2 对齐文本

  • text-align 属性用于设置元素内文本内容的水平对齐方式。
div { 
 text-align: center;
}
属性值说明
left左对齐(默认)
right右对齐
center居中对齐

4.3 装饰文本

  • text-decoration 属性规定添加到文本的修饰。可以给文本添加下划线、删除线、上划线等。
div { 
 text-decoration:underline;
}
属性值描述
none默认 没有装饰线
underline下划线 标签a自带下划线(超链接跳转)
overline上划线
line-through删除线
<head>
    <style>
        #blue{ text-decoration: underline;}
    </style>
</head>
<body>
    <div id='blue'>这是一个div标签</div>
</body>

在这里插入图片描述

4.4 文本缩进

  • text-indent 属性用来指定文本的第一行的缩进,通常是将段落的首行缩进
div { 
 text-indent: 10px;
}
  • 通过设置该属性,所有元素的第一行都可以缩进一个给定的长度,甚至该长度可以是负值。
p { 
 text-indent: 2em;
}
  • em 是一个相对单位,1em = 当前标签的font-size的大小, 如果当前元素没有设置大小,则会按照父元素的 1 个文字大小。

4.5 行间距

  • line-height 属性用于设置行间的距离(行高)。可以控制文字行与行之间的距离.
p { 
 line-height: 26px;
}

在这里插入图片描述

属性表示注意点
color文本颜色通常用十六进制 而且是简写形式 eg:#fff
text-align文本对齐可以设定文字水平对齐方式
text-indent文本缩进通常用于段落首行缩进2个字的距离:text-indent:2em
text-decoration文本修饰记住添加下划线:underline 取消下划线:none
line-height行高控制行与行之间的距离
  • 2
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 2
    评论
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

耶耶LCY

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值