此页包含文本命名空间中的属性（名称中带有单词的属性）以及其他一些相关属性。text
除了各种CSS字体属性之外，还有其他属性可以帮助设置文本样式。例如，您可以更改文本的颜色、对齐文本、添加装饰属性等。文章源自你的网络首码项目网-https://www.youranweb.com/255.html
在CSS中，可以使用下面列出的属性设置文本样式。使用此列表，您可以了解如何使用每个css文本属性及其在浏览器中的外观。文章源自你的网络首码项目网-https://www.youranweb.com/255.html
文本颜色
有关详细信息，请参阅颜色属性。文章源自你的网络首码项目网-https://www.youranweb.com/255.html
<!DOCTYPE html>
<title>Example</title>
<style>
p {
color: olive;
}
</style>
<p>此 CSS 文本颜色为橄榄色</p>文本对齐
有关详细信息，请参阅文本对齐属性。文章源自你的网络首码项目网-https://www.youranweb.com/255.html
<!DOCTYPE html>
<title>Example</title>
<style>
p {
text-align: right;
}
</style>
<p>此 CSS 文本右对齐</p>文本缩进
<!DOCTYPE html>
<title>Example</title>
<style>
p {
text-indent: 50px;
}
</style>
<p>此文本缩进 50 像素。这意味着段落的第一行将缩进 50 像素，但以下行不会缩进。文本需要换行才能看到缩进 - 因此所有这些文本！</p>字母间距
有关详细信息，请参阅字母间距属性。文章源自你的网络首码项目网-https://www.youranweb.com/255.html
<!DOCTYPE html>
<title>Example</title>
<style>
p {
letter-spacing: 5px;
}
</style>
<p>此文本应用了字母间距</p>字间距
有关详细信息，请参阅字间距属性。文章源自你的网络首码项目网-https://www.youranweb.com/255.html
<!DOCTYPE html>
<title>Example</title>
<style>
p {
word-spacing: 50px;
}
</style>
<p>此文本应用了字间距</p>文本修饰
有关详细信息，请参阅文本修饰属性。文章源自你的网络首码项目网-https://www.youranweb.com/255.html
<!DOCTYPE html>
<title>Example</title>
<style>
.overline {
text-decoration: overline;
}
.line-through {
text-decoration: line-through;
}
.underline {
text-decoration: underline;
}
a:link {
text-decoration: none;
}
</style>
<p class="overline">此文本的顶部有一行</p>
<p class="line-through">此文本中间有一行</p>
<p class="underline">此文本下面有一行</p>
<a href="/css/" target="_blank">此超链接没有下划线</a>文本转换
有关详细信息，请参阅文本转换属性。文章源自你的网络首码项目网-https://www.youranweb.com/255.html
<!DOCTYPE html>
<title>Example</title>
<style>
.uppercase {
text-transform: uppercase;
}
.lowercase {
text-transform: lowercase;
}
.capitalize {
text-transform: capitalize;
}
</style>
<p class="uppercase">此文本已转换为大写</p>
<p class="lowercase">此文本已转换为小写</p>
<p class="capitalize">此文本已大写。</p>文本方向
有关详细信息，请参阅方向属性。文章源自你的网络首码项目网-https://www.youranweb.com/255.html
<!DOCTYPE html>
<title>Example</title>
<style>
p {
direction: rtl;
}
</style>
<p>此文本从右向左运行。这对于文本从右向左排列的语言非常有用。虽然英语不是很有用...</p>CSSunicode-bidi
有关详细信息，请参阅统一码-双向属性。文章源自你的网络首码项目网-https://www.youranweb.com/255.html
将其与direction属性结合使用可确定文本的方向。可能的值：正常值、嵌入值、双向覆盖值和继承值。文章源自你的网络首码项目网-https://www.youranweb.com/255.html
<!DOCTYPE html>
<title>Example</title>
<style>
p {
direction: rtl;
unicode-bidi: bidi-override;
}
</style>
<p>此文本从右向左运行。这对于文本从右向左排列的语言非常有用。虽然英语不是很有用....</p>文本阴影
有关详细信息，请参阅文本阴影属性。文章源自你的网络首码项目网-https://www.youranweb.com/255.html
<!DOCTYPE html>
<title>Example</title>
<style>
p {
text-shadow: 2px 2px 8px orange;
}
</style>
<p>如果您的浏览器支持 CSS 文本阴影属性，则此文本将具有阴影。</p>空白区域
告诉浏览器如何处理空格。可能的值：、和。normalprenowrap文章源自你的网络首码项目网-https://www.youranweb.com/255.html
有关详细信息，请参阅空白属性。文章源自你的网络首码项目网-https://www.youranweb.com/255.html
<!DOCTYPE html>
<title>Example</title>
<style>
p {
white-space: pre;
}
</style>
<p>此文本有一个换行符（实际上，它有很多换行符！），空格预设设置告诉浏览器像HTML pre标记一样尊重它。
</p>文章源自你的网络首码项目网-https://www.youranweb.com/255.html文章源自你的网络首码项目网-https://www.youranweb.com/255.html
评论