CSS（三）常见的CSS文本样式

最新推荐文章于 2022-11-22 07:45:00 发布

原创最新推荐文章于 2022-11-22 07:45:00 发布 · 405 阅读

0 ·

CC 4.0 BY-SA版权

CSS 专栏收录该内容

5 篇文章

订阅专栏

博客介绍了常见的CSS文本样式，包括使用text-indent属性实现段落首行缩进，用word-wrap:break-word解决连续字母或数字不自动换行问题，以及引用自定义字体并通过letter-spacing属性设置字体间距。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

常见的CSS文本样式

1、段落首行缩进

通常text-indent缩进属性将对段落首行开头文本文字进行缩进显示。

.popContent-desc {
                text-indent: 0.1rem;
              }

以上代码就是对div进行0.1rem的首行缩进。

2、中英文文字段落自动换行

当然中文字在DIV或任意盒子中均会自动换行不需要CSS样式实现，只有连续的字母或数字会出现不自动换行问题，所以需要CSS解决。此时需要给DIV一个最大的宽度或宽度，并结合word-wrap:break-word实现自动换行。

.popContent-desc {
                width: 100%;
                word-wrap: break-word;
              }

3、引用自定义字体

引用自定义字体，并用letter-spacing属性设置字体间距

@font-face {
  font-family: 'titlefont';
  src: url('../../font/百度综艺简体.ttf');
}
#login .logo p {
  font-size: 1.8vw;
  line-height: 50px;
  color: #fff;
  letter-spacing: 7px;
  font-family: 'titlefont';
}