CSS - 文本

文本是指可以阅读和理解的文字或字符形式的书面或印刷信息。文本可以包括书籍、文章、电子邮件、消息、网页等内容。

设置文本样式涉及修改其外观，使其在视觉上更具吸引力或传达特定信息。本章演示如何使用 CSS 属性操作文本。

有几种方法可以设置文本样式。CSS 提供的以下属性可用于样式设置目的：

color：设置文本的颜色。
text-align：设置文本的对齐方式。
text-align-last：设置文本块最后一行的对齐方式。
direction：设置元素文本的方向。
text-indent：设置文本第一行的缩进。
letter-spacing：指定组成单词或文本的字母或字符之间的间距。
word-spacing：指定文本中单词之间的间距。
white-space：控制元素中文本内部的空白流。
text-decoration：在一段文本上添加下划线、上划线和删除线。
text-decoration-skip：确定需要跳过元素内容的哪一部分，即文本修饰影响的部分。
text-decoration-skip-ink：指定如何在字形上升和下降线周围绘制上划线和下划线文本装饰线。
text-transform：将文本转换为大写或小写字母。
text-emphasis：对文本（空格和控制字符除外）应用强调标记。
text-shadow：为文本添加阴影。
line-break：控制如何设置换行符规则。
word-break：控制如何设置分词规则。

CSS Text - 文本颜色

更改文本的颜色可以增加视觉趣味或与特定的设计方案保持一致。

color 属性用于设置文本的颜色。此属性的可能值如下所示：

颜色名称：示例 = red, blue, green
十六进制值：示例 = #ff00ff。
RGB 值：示例 = rgb（125， 255， 0）。

下面是一个示例：


<html>
<head>
</head>
<body>
	 <h2>Text Color</h2>
			<p style = "color: blueviolet;">
				 Color Name
			</p>
			<p style = "color:#ff00ff;">
				 Hexadecimal value
			</p>
			<p style = "color: rgb(255,124,100);">
				 RGB value
			</p>
</body>
</html>

CSS text - 文本对齐

文本在页面上的位置或位置称为其对齐方式。文本根据页面的左边距和右边距对齐。

定义文本对齐方式的 CSS 属性是 text-align。它设置文本的水平对齐方式。

以下是此属性可以保存的可能值：

start：如果方向是 LTR，则与左相同，如果方向是 RTL，则向右相同。
end：如果方向是 LTR，则与右边相同，如果方向是 RTL，则向左。
left：与左边距对齐。
right：与右边距对齐。
center：在页面中心对齐。
justify：与两个边距对齐。
justify-all：与 justify 相同，使最后一行也对齐。
match-parent：类似于 inherit。start 和 right 的值取自父值，并由 left 和 right 替换。

当方向为 ltr 时，默认对齐方式为左对齐，当方向为 rtl 时，默认对齐方式为右对齐。

下面是一个示例：


<html>
<head>
</head>
<body>
	 <h2>Text Alignment</h2>
			<p style="text-align: left;">Text Left Alignment.</p>
			<p style="text-align: right;">Text Right Alignment.</p>
			<p style="text-align: center;">Text Center Alignment.</p>
			<p style="text-align: justify; border: 2px solid red; width: 200px; height: 100px;">
				 Text Justify Alignment. This alignment aligns the text based on both the margins, left and right.
			</p>
</body>
</html>

CSS 文本 - 垂直对齐

vertical-align 属性用于在内联、内联块和表格单元格中垂直对齐文本。

vertical-align 属性可以具有以下值之一：

baseline：元素的基线与父元素的基线对齐。
sub：将元素的基线降低到适合下标文本的点。
super：将元素的基线提高到适合上标文本的点。
top：在内联内容的上下文中，元素框的顶部与行框的顶部对齐，或者在表的上下文中与表单元格的顶部对齐。
text-top：元素框的顶部与行中最高的内联框的顶部对齐。
middle：在内联内容的上下文中，元素的基线与父元素的基线加上父元素字体的 x 高度的一半定义的点对齐。
bottom：在内联内容的上下文中，元素框的底部与行框的底部对齐，或者在表的上下文中与表单元格的底部对齐。
text-bottom：元素框的底部与行中最低内联框的底部对齐。
percentage：元素的基线按属性行高值的给定百分比升高或降低。
length：元素的基线被给定的长度值升高或降低。此属性允许使用负长度值。此属性的长度值为 0 与值基线具有相同的效果。

下面是一个示例：


<html>
<head>
<style>
	 table,td {height:100px; width:400px; border:1px solid red;}
</style>
</head>
<body>
	 <table>
	 <tr>
			<td style="vertical-align: baseline">baseline</td>
			<td style="vertical-align: top">top</td>
			<td style="vertical-align: middle">middle</td>
			<td style="vertical-align: bottom">bottom</td>
			<td>
				 <p>
						No vertical alignment
				 </p>
			</td>
	 </tr>
	 </table>
	 <p>
	 top: 				<img style="vertical-align: top" src="images/smiley.png" alt="star"/>
	 middle: 		 <img style="vertical-align: middle" src="images/smiley.png" alt="star"/>
	 bottom: 		 <img style="vertical-align: bottom" src="images/smiley.png" alt="star"/>
	 super: 			<img style="vertical-align: super" src="images/smiley.png" alt="star"/>
	 sub: 				<img style="vertical-align: sub" src="images/smiley.png" alt="star"/>
	 </p>

	 <p>
	 text-top: 	 <img style="vertical-align: text-top" src="images/smiley.png" alt="star"/>
	 text-bottom: <img style="vertical-align: text-bottom" src="images/smiley.png" alt="star"/>
	 0.2em: 			<img style="vertical-align: 0.3em" src="images/smiley.png" alt="star"/>
	 -1em: 			 <img style="vertical-align: -2em" src="images/smiley.png" alt="star"/>
	 20%: 				<img style="vertical-align: 30%" src="images/smiley.png" alt="star"/>
	 -100%: 			<img style="vertical-align: -100%" src="images/smiley.png" alt="star"/>
	 </p>
</body>
</html>

CSS text - 方向

文本方向是指文档或元素中文本字符的方向。它根据所使用的书写系统确定文本是应从左到右（LTR）还是从右到左（RTL）显示。

在 CSS 中，您可以使用 direction 属性设置文本方向。direction 属性接受两个主要值：

LTR（从左到右）：默认值，用于从左到右书写的语言，如英语。除非您想要覆盖继承的从右到左方向，否则无需显式指定此值。
RTL（从右到左）：用于从右到左书写的语言，例如阿拉伯语或希伯来语。使用 rtl 时，默认情况下文本将右对齐。

此外，CSS 还提供了一个速记属性 unicode-bidi 来控制 bidi 算法，该算法指定了具有不同书写方向的字符在同一段落中出现时的显示方式。unicode-bidi 最常见的值是 normal，它允许浏览器自动处理文本方向。

下面是一个示例：


<html>
<head>
</head>
<body>
	 <p style = "direction: rtl;">
			Right to Left
	 </p>
	 <p style = "direction: ltr;">
			Left to Right
	 </p>
</body>
</html>

CSS 文本 - 使用 unicode-bidi

让我们看一个 unicode-bidi 的用法示例：


<html>
<head>
<style>
	 p.example {
			direction: rtl;
			unicode-bidi: bidi-override;
	 }
</style>
</head>
<body>
	 <h2>Text Direction</h2>
			<p>Check for the text direction.</p>
			<p class="example">Check for the text direction.</p>
</body>
</html>

CSS Text - 文本修饰

属性 text-decoration 有助于为文本添加额外的装饰，例如，向行添加行（下划线、删除线、上划线）和颜色、样式和粗细。

它是以下属性的简写属性：

text-decoration-line：设置装饰线的类型（下划线、删除线或上划线）。
text-decoration-color：设置文本装饰的颜色。
text-decoration-style：设置文本装饰的样式（虚线、虚线、实心、波浪形、双倍等）
text-decoration-thickness：设置文本修饰的厚度。

下面是一个示例：


<html>
<head>
</head>
<body>
	 <h2>Text Decoration</h2>
			<p style="text-decoration: overline solid red 5px;">Overline text decoration.</p>
			<p style="text-decoration: line-through solid green 1px;">Line-through text decoration.</p>
			<p style="text-decoration: underline dashed 2pt blue;">Underline text decoration.</p>
</body>
</html>

CSS Text - 文本修饰跳过

text-decoration-skip 属性确定需要跳过元素内容的哪一部分，即文本修饰影响的部分。

text-decoration-skip 属性可以具有以下值：

none：不跳过任何内容，并对所有文本内容应用文本修饰。
objects：跳过元素的整个边距框，例如图像或内联块。
spaces：跳过所有间距。
leading-spaces：与空格相同，仅跳过前导空格。
trailing-spaces：与空格相同，仅跳过尾随空格。
edges：文本的开头和结尾等边缘略微插入。为相邻元素分隔下划线。
box-decoration：跳过框的边距、边框和填充区域上的文本修饰。
initial：将 text-decoration-skip 值设置为其默认值（none）。
inherit：从其父元素继承 text-decoration-skip 值。
unset：删除任何以前设置的 text-decoration-skip 值。

注意：目前，仅在 Safari 浏览器上支持此属性。

下面是一个示例：


<html>
<head>
</head>
<body>
	 <h2>Text Decoration Skip</h2>
			<p style="font-size:3em; text-decoration: underline solid red 5px; text-decoration-skip: edges;">Observe the edges of the line.</p>
			<p style="font-size:3em; text-decoration: underline solid green 5px; text-decoration-skip: spaces;">Its text decoration skip spaces.</p>
</body>
</html>

CSS Text - 文本修饰跳过墨水

text-decoration-skip-ink 属性指定如何在字形或字符升序和降序周围绘制上划线和下划线文本修饰线。

text-decoration-skip-ink 属性可以具有以下值：

none：不跳过任何内容，并对所有文本内容应用文本修饰。
auto：跳过元素的整个边距框，例如图像或内联块。
all：跳过所有间距。（仅在 Firefox 和 Safari 上受支持）

在以下示例中，观察字母（p，g）和上升符（h）的下降器如何受此属性的影响：


<html>
<head>
</head>
<body>
	 <h2>Text Decoration Skip Ink</h2>
			<p style="font-size:3em; text-decoration: underline solid red 5px; text-decoration-skip-ink: auto;">paragraph.</p>
			<p style="font-size:3em; text-decoration: underline solid green 5px; text-decoration-skip-ink: none;">paragraph.</p>
</body>
</html>

CSS 文本 - 文本转换

text-transform 属性用于通过以各种方式转换文本来更改文本的外观。它可用于将文本转换为大写、小写、将每个单词的第一个字母大写，甚至将所有字母大写。

text-transform 属性可以具有以下值之一：

lowercase：将所有文本转换为小写。
uppercase：将所有文本转换为大写。
capitalize：将每个单词的第一个字符大写。
none：不应用文本转换。
full-width：将所有字符转换为其全角变体。
full-size-kana：将所有小假名字符转换为全尺寸假名字符。这专门用于<ruby>注释文本。
initial：将文本转换值设置为其默认值（none）。
inherit：从其父元素继承 text-transform 值。
unset：删除任何以前设置的文本转换值。

需要注意的是，text-transform 会影响文本的视觉呈现，而不会改变实际的 HTML 内容。

下面是一个示例：


<html>
<head>
<style>
	 div {border:2px solid red; padding: 5px; margin: 2px; width: 300px;}
	 span {text-transform: full-width;}
	 strong {width: 100%;}
</style>
</head>
<body>
	 <h2>Text Transform</h2>
	 <div>
			<p style="text-: capitalize;">Text transformed.</p>
	 </div>
	 <div>
			<p style="text-transform: lowercase;">Text transformed.</p>
	 </div>
	 <div>
			<p style="text-transform: uppercase;">Text transformed.</p>
	 </div>
	 <div>
			<p style="text-transform: none;">Text transformed.</p>
	 </div>
	 <div>
			<strong>
			<span>TRANSFORMATION OF TEXT AS FULL-WIDTH.</span>
			</strong>
	 </div>
</body>
</html>

CSS Text - 文本强调

CSS 提供了一个属性，用于使用 text-emphasis 属性在文本块上应用强调标记。这些标记通常用于突出显示特定内容或指示某些语言的发音或重音。

它允许设计者对文本块中的单个字符或短语进行强调。

它是 text-emphasis-style 和 text-emphasis-color 的简写。

text-emphasis 属性可以具有以下值之一：

none：不设置强调标记。
filled：用纯色填充元素。默认值。
open：将形状设置为空心。
dot：显示为小圆圈的标记，可以是打开的圆点，也可以是实心圆点。
circle：显示为大圆圈的标记，可以是开放的圆圈，也可以是实心圆圈。水平书写的默认形状。
double-circle：显示为双圆圈的标记，可以是打开的双圆圈，也可以是实心的双圈。
triangle：显示为三角形的标记，可以是开放三角形，也可以是实心三角形。
sesame：显示为芝麻（~）的标记，可以是打开的芝麻，也可以是填充的芝麻。竖向书写的默认形状。
<string>：显示为传递的字符串值的标记。
<color>：设置标记的颜色。

下面是一个示例：


<html>
<head>
</head>
<body>
	 <h2>Text Emphasis</h2>
			<p style="text-emphasis: dot;">The emphasis is a dot.</p>
			<p style="text-emphasis: circle red;">The emphasis is a circle.</p>
			<p style="text-emphasis: triangle;">The emphasis is a triangle.</p>
			<p style="text-emphasis: none;">No emphasis to the text.</p>
			<p style="text-emphasis: double-circle green;">The emphasis is a double-circle.</p>
			<p style="text-emphasis: open;">The emphasis is open.</p>
			<p style="text-emphasis: sesame;">The emphasis is a sesame.</p>
			<p style="text-emphasis: 'u' #00ff00;">The emphasis is a string.</p>
</body>
</html>

CSS Text - 文本缩进

缩进是边距和文本第一行之间的空间。正确的缩进可以提高页面上文本的可读性和清晰度。

CSS 还提供了一个属性来设置文本缩进，即文本缩进。可以将以下值传递给此属性：

length：任何特定长度 {像素（px）、点（pt）、ems （em）等}。默认值为 0。
percentage (%)：传递的值与父元素宽度的百分比有关。
each-line：影响文本块的第一行以及强制换行后的每一行。
hanging：缩进反转，第一行除外。
initial：将文本缩进设置为其默认值。
inherit：允许从其父元素继承 text-indent 值。

注意：截至目前，任何浏览器都不支持每行和悬挂的值。

下面是一个示例：


<html>
<head>
</head>
<body>
	 <h2>Text indentation</h2>
			<p style="text-indent: 2cm;">Text indentation at 2 cm.</p>
			<p style="text-indent: 2in;">Text indentation at 2 inches.</p>
			<p style="text-indent: 20%;">Text indentation at 20%.</p>
</body>
</html>

CSS 文本 - 字母间距

调整文本中字母之间的间距会影响网页的可读性和整体美感。

属性字母间距用于调整文本字母之间的间距。字母之间的空间可以增加或减少。

以下是此属性可以具有的可能值：

normal：默认值，表示字母之间的正常间距量。
length：任何特定长度 {像素（px）、点（pt）、ems （em）或百分比（%）}。
initial：将字母间距设置为默认值。
inherit：允许从其父元素继承字母间距值。

注意：字母之间的实际间距可能因所使用的字体而异。

下面是一个示例：


<html>
<head>
</head>
<body>
	 <h2>Letter spacing</h2>
			<p style="letter-spacing: normal;">Letter spacing normal.</p>
			<p style="letter-spacing: 5px;">Letter spacing increased.</p>
			<p style="letter-spacing: -1px;">Letter spacing decreased.</p>
</body>
</html>

CSS 文本 - 字间距

CSS 提供了调整文本中单词之间间距的属性，就像字母间距一样。调整单词之间间距的属性是单词间距。

此属性可以采用以下值：

normal：默认值，表示单词之间的正常间距量。
length：任何特定长度 {像素（px）、点（pt）、ems （em）或百分比（%）}。
initial：将单词间距设置为默认值。
inherit：允许从其父元素继承单词间距值。

下面是一个示例：


<html>
<head>
</head>
<body>
	 <h2>Word spacing</h2>
			<p style="word-spacing: normal;">Word spacing normal.</p>
			<p style="word-spacing: 15pt;">Word spacing increased.</p>
			<p style="word-spacing: -1px;">Word spacing decreased.</p>
</body>
</html>

CSS 文本 - 空白

在文本中，空白是指不显示可见符号或对文本含义产生任何影响的任何空白区域或字符。

以下是您可能会遇到空格的一些情况：

前导空格是出现在行的第一个可见字符之前的空格，而尾随的空格出现在最后一个可见字符之后。
空格，通常采用换行符或段落分隔符的形式。
空格经常用于缩进目的，特别是在编程语言或编写结构化文本时。
可以使用不间断的空格字符，例如 HTML 实体 nbsp （）。
文本中连续的空格将被视为单个空格。例如，多次按空格键。

white-space 的不同值如下：

normal：默认值，其中空格序列被折叠，当文本达到可用宽度时，文本换行到下一行。
nowrap：空格折叠，文本不会换行到下一行。它在同一条线上继续，溢出可用宽度。
pre：完全保留 HTML 代码中的空格。换行符和多个空格按原样显示。
pre-wrap：保留 HTML 代码中的换行符和空格。
pre-line：折叠空格，但保留换行符。当文本达到可用宽度时，文本将换行。
break-spaces：折叠空格序列，但保留换行符并换行机会。这是一个实验值，可能并非在所有浏览器中都受支持。
initial：将值设置为默认值，这是正常的。
inherit：从其父元素继承值。

这些值可以与其他 CSS 属性（如 overflow 和 text-overflow）结合使用，以控制空格的行为。

下面是一个示例：


<html>
<head>
<style>
	 div {border:2px solid red; padding: 5px; margin: 2px; width: 300px; height: 100px;}
</style>
</head>
<body>
	 <h2>White Space</h2>
	 <h4>normal</h4>
	 <div>
			<p style="white-space: normal;">white space refers to any empty space or characters that do not display
			a visible symbol or have any effect on the text's meaning</p>
	 </div>
	 <h4>pre</h4>
	 <div>
			<p style="white-space: pre;">white space refers to any empty space or characters that do not display
			a visible symbol or have any effect on the text's meaning</p>
	 </div>
	 <h4>nowrap</h4>
	 <div>
			<p style="white-space: nowrap;">white space refers to any empty space or characters that do not display
			a visible symbol or have any effect on the text's meaning</p>
	 </div>
	 <h4>pre-wrap</h4>
	 <div>
			<p style="white-space: pre-wrap;">white space refers to any empty space or characters that do not display
	 a visible symbol or have any effect on the text's meaning</p>
	 </div>
	 <h4>pre-line</h4>
	 <div>
			<p style="white-space: pre-line;">white space refers to any empty space or characters that do not display
			a visible symbol or have any effect on the text's meaning</p>
	 </div>
	 <h4>break-spaces</h4>
	 <div>
			<p style="white-space: break-spaces;">white space refers to any empty space or characters that do not display
			a visible symbol or have any effect on the text's meaning</p>
	 </div>
</body>
</html>

CSS 文本 - 空白折叠

white-space-collapse 属性检查如何折叠元素内的空白。

white-space 属性是 white-space-collapse 和 text-wrap 属性的简写。

white-space-collapse 的不同值如下：

collapse：空白序列被折叠。
preserve：保留空白序列和分段符的字符。
preserve-breaks：空白序列被折叠，段分隔符的字符被保留。
preserve-spaces：保留空格序列，并将分段符和制表符的字符转换为空格。
break-spaces：类似于 'preserve'。连续的空格、制表符和换行符将折叠为一个空格，但单个空格将保持原样。

截至目前，浏览器部分支持 white-space-collapse 属性，因为它仍处于实验模式。

CSS 文本 - 带阴影

text-shadow 属性用于为文本添加阴影效果。它允许您指定阴影的颜色、偏移、模糊半径和扩散半径。

通过使用此属性，您可以创建各种文本效果，例如为文本提供 3D 或发光外观，或者为文本添加强调和深度。

该属性指定 X 和 Y 偏移量、模糊半径和颜色值的组合。没有强制要求固定的值顺序。它被指定为以逗号分隔的阴影值列表。

Text-Shadow 属性接受以下值：

<color>：

设置阴影的颜色。
它是可选的。
它可以在偏移值之前或之后指定。
可以指定任何颜色值，例如名称、十六进制或 RGB 值。

<offset-x><offset-y>：

任何长度值，指定 x 和 y 值。
X 值表示阴影与文本的水平距离。
Y 值表示阴影与文本的垂直距离。
如果 x 和 y 值等于 0，则阴影将显示在文本后面。

<blur-radius>：

任何长度值，指定 blur-radius 的值。
它是可选的。
要使模糊看起来更大，您需要提供更高的值。
如果未传递任何值，则取为 0。

例子

下面是一个示例：


<html>
<head>
</head>
<body>
	 <h2>Text Shadow</h2>
			<p style="text-shadow: 2px 5px yellow;"> Simple Text shadow </p>
			<p style="text-shadow: 5px 5px 2px #ff00ff;">Text shadow with blur radius</p>
			<p style="text-shadow: 1px 1px 2px green, 0 0 1em yellow, 0 0 0.2em red;">Multiple shadows</p>
			<p style="text-shadow: 0px 0px 10px rgb(26, 69, 105); ">Text shadow with RGB colors</p>
</body>
</html>

CSS 文本 - 换行符

CSS 提供了属性换行符，可用于确定如何在文本块中分行。

以下是此属性可以具有的值：

auto：应用默认换行规则。
loose：应用限制最少的换行规则。
normal：应用最常见的换行规则。
strict：应用最严格的换行规则。
anywhere：允许浏览器在任何地方、任何字符处应用换行规则。
initial：设置初始值。
inherit：继承父元素的值。

下面是一个示例：


<html>
<head>
<style>
	 p {
			border: 2px solid blue;
			width: 200px;
	 }
	 .normal {
			line-break: normal;
	 }
	 .loose {
			line-break: loose;
	 }
	 .strict {
			line-break: strict;
	 }
	 .auto {
			line-break: auto;
	 }
	 .anywhere {
			line-break: anywhere;
	 }
</style>
</head>
<body>
	 <h2>Line Break</h2>
			<p class="normal">Normal - CSS provides property <b>line-break</b> that is useful in determining how to break lines in a block of text.</p>
			<p class="loose">Loose - CSS provides property <b>line-break</b> that is useful in determining how to break lines in a block of text</p>
			<p class="strict">Strict - CSS provides property <b>line-break</b> that is useful in determining how to break lines in a block of text</p>
			<p class="auto">Auto - CSS provides property <b>line-break</b> that is useful in determining how to break lines in a block of text</p>
			<p class="anywhere">Anywhere - CSS provides property <b>line-break</b> that is useful in determining how to break lines in a block of text</p>
</body>
</html>

CSS 文本 - 分词符

CSS 中的 word-break 属性用于指定在单词超过元素的可用宽度时应如何分隔或换行。它决定浏览器是否应该允许单词在任何时候中断，或者它们是否应该保持在一起。

以下是此属性可以具有的值：

normal：使用默认换行规则。
break-all：在任意两个字符之间应用分词符，以防止溢出。
keep-all：中文、日文和韩文（CJK）文本不得使用分词符;对于其他语言或非 CJK 文本，行为与正常文本相同。
break-word：这行为与 overflow-wrap： anywhere 相同，即应用任何单词的分词符。但此值已弃用。

下面是一个示例：


<html>
<head>
<style>
	 p {
			border: 2px solid green;
			width: 200px;
	 }
	 .normal {
			word-break: normal;
	 }
	 .all {
			word-break: break-all;
	 }
	 .keep {
			word-break: keep-all;
	 }
	 .wordbreak {
			word-break: break-word;
	 }
</style>
</head>
<body>
	 <h2>Word Break</h2>
			<p class="normal">normal - CSS provides property <b>word-break</b> that is useful in determining how to break words in a block of text</p>
			<p class="all">break-all - CSS provides property <b>word-break</b> that is useful in determining how to break words in a block of text</p>
			<p class="keep">keep-all - CSS provides property <b>word-break</b> that is useful in determining how to break words in a block of text</p>
			<p class="wordbreak">break-word - CSS provides property <b>word-break</b> that is useful in determining how to break words in a block of text</p>
</body>
</html>

CSS 文本 - 相关属性

以下是样式文本的 CSS 属性列表：

属性	描述
color	设置文本的颜色。
text-align	设置文本的对齐方式。
text-align-last	设置文本块的最后一行的对齐方式。
vertical-align	设置文本的垂直对齐方式
direction	设置文本的方向。
text-indent	设置文本第一行的缩进。
letter-spacing	指定单词字母之间的间距。
word-spacing	指定文本块中单词之间的间距。
white-space	控制元素中文本内部的空白流。
text-decoration	用于设置文本修饰的简写属性。
text-transform	将文本转换为大写、小写或大写。
text-emphasis	对文本应用强调标记。
text-shadow	为文本添加阴影。
line-break	控制如何设置换行符的规则。
word-break	控制如何设置分词规则。
text-effects	为文本添加特殊的视觉效果。
text-combine-upright	将多个排版字符单元合并到单个排版字符单元的空间中。.
text-orientation	设置行中文本字符的方向。
text-underline-offset	为文本添加特殊的视觉效果。
text-overflow	控制如何向用户显示隐藏的溢出内容。

打印本页