CSS 文本样式 包括单个文字样式、段落样式
在CSS中，可以使用各种属性来设置文本的样式，包括字体、大小、颜色、行高、对齐方式等。以下是一些常用的文本样式设置示例：
/* 单个字母样式 */
.letter-style {
font-family: 'Arial'; /* 设置字体 */
font-size: 20px; /* 设置字号 */
font-weight: bold; /* 设置字体粗细 */
color: #333333; /* 设置字体颜色 */
text-decoration: underline; /* 设置下划线 */
}
/* 段落样式 */
.paragraph-style {
line-height: 1.5; /* 设置行高 */
color: #666666; /* 设置文本颜色 */
text-align: center; /* 设置文本居中对齐 */
}在HTML中使用这些样式：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Text Styles Example</title>
<style>
/* 将CSS代码放在这里 */
.letter-style {
font-family: 'Arial';
font-size: 20px;
font-weight: bold;
color: #333333;
text-decoration: underline;
}
.paragraph-style {
line-height: 1.5;
color: #666666;
text-align: center;
}
</style>
</head>
<body>
<p>This is a <span class="letter-style">paragraph</span> with custom styles.</p>
<p class="paragraph-style">This paragraph is styled and centered.</p>
</body>
</html>在这个例子中，第一个<p>标签中的<span>元素使用了.letter-style类来设置单个字母的样式，而第二个<p>标签使用.paragraph-style类来设置整个段落的样式。
评论已关闭