Laravel  
laravel
文档
数据库
架构
入门
php技术
    
Laravelphp
laravel / php / java / vue / mysql / linux / python / javascript / html / css / c++ / c#

css文本属性有哪些

作者:_o隨缘   发布日期:2025-08-06   浏览:66

/* CSS 文本属性示例 */

/* 设置文本颜色 */
p {
  color: blue;
}

/* 设置字体大小 */
h1 {
  font-size: 24px;
}

/* 设置字体粗细 */
strong {
  font-weight: bold;
}

/* 设置字体样式(斜体) */
em {
  font-style: italic;
}

/* 设置文本对齐方式 */
p.align-center {
  text-align: center;
}

/* 设置文本缩进 */
p.indent {
  text-indent: 20px;
}

/* 设置行高 */
p.line-height {
  line-height: 1.5;
}

/* 设置字间距 */
p.letter-spacing {
  letter-spacing: 2px;
}

/* 设置单词间距 */
p.word-spacing {
  word-spacing: 4px;
}

/* 设置文本修饰(下划线、删除线等) */
a {
  text-decoration: underline;
}

/* 设置首行大写字母 */
p.capitalize {
  text-transform: capitalize;
}

/* 设置文本转换为大写或小写 */
h2.uppercase {
  text-transform: uppercase;
}
h2.lowercase {
  text-transform: lowercase;
}

/* 设置文本阴影 */
h1.shadow {
  text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
}

解释说明:

  • color: 设置文本的颜色。
  • font-size: 设置文本的字体大小。
  • font-weight: 设置文本的字体粗细。
  • font-style: 设置文本的字体样式,如斜体。
  • text-align: 设置文本的对齐方式,如居中、左对齐、右对齐。
  • text-indent: 设置文本的首行缩进。
  • line-height: 设置文本的行高。
  • letter-spacing: 设置字符之间的间距。
  • word-spacing: 设置单词之间的间距。
  • text-decoration: 设置文本的装饰效果,如下划线、删除线等。
  • text-transform: 设置文本的转换方式,如首字母大写、全部大写或全部小写。
  • text-shadow: 设置文本的阴影效果。

上一篇:css锚点定位

下一篇:css超出部分省略号

大家都在看

css 红色

css 瀑布流布局grid

css文字超长省略号

css 渐变字体

css背景图片等比例缩放

css文字删除线

animation css3

css 自定义滚动条

css flex gap

css上一个兄弟元素怎么找到

Laravel PHP 深圳智简公司。版权所有©2023-2043 LaravelPHP 粤ICP备2021048745号-3

Laravel 中文站