腾讯云·社区
CSS3 text 学习笔记
CSS3 text属性
- text-align(文本对齐方式)
- text-decoration(添加文本修饰)
- text-indent(首行缩进)
- text-shadow(设置阴影)
- line-height(设置行高)
- letter-sapcing(设置字符间距)
text.html
<head>
<title>text</title>
<link rel="stylesheet" href="style_text.css" type="text/css" />
</head>
<body>
<h2>Hello World</h2>
<p>无穷的远方，无数的人们，都与我有关，很高兴和你建立这份连结。</p>
</body>text-align
- 规定文本的水平对齐方式
- 默认值由浏览器决定
- 可能的值：left(左对齐)，right(右对齐)，center(居中)，justify(两端对齐)
style_text.css
h2 {
text-align: center;
font-family: Georgia, "Times New Roman", Times, serif;
font-weight: bold;
font-style: italic;
}
p {
text-align: center;
font-style: italic;
font-weight: bold;
}text-decoration
- 规定添加到文本的修饰
- 默认值为none
- 可能的值：none，underline(下划线)，overline(上划线)，line-through(删除线)，blink(闪烁的文本)
text-indent
- 规定首行缩进
- 可能的值：固定的缩进(默认为0)
text-shadow
- 设置文本阴影
- 所需参数h-shadow，v-shadow，blur，color
- h-shadow：水平阴影的位置，即水平偏移量
- v-shadow：垂直阴影的位置，即垂直偏移量
- blur：模糊的距离
- color：阴影的颜色
style_text.css
h2 {
text-align: center;
font-family: Georgia, "Times New Roman", Times, serif;
font-weight: bold;
font-style: italic;
}
p {
text-align: center;
text-decoration: underline;
text-shadow: 2px 2px 4px black;
color: white;
font-style: italic;
font-weight: bold;
}本文分享自微信公众号 - 小白也编程（program_learning），作者：LRainner
原文出处及转载信息见文内详细说明，如有侵权，请联系 yunjia_community@tencent.com 删除。
原始发表时间：2020-02-16
本文参与腾讯云自媒体分享计划，欢迎正在阅读的你也加入，一起分享。
相关文章
扫码关注云+社区
领取腾讯云代金券
我来说两句