CSS文本相关属性

简介: letter-spacing、word-spacing分别用于设置字母、单词之间的间距

image.png


1 text-decoration


text-decoration有如下常见取值:


  • none:无任何装饰线 ✓ 可以去除a元素默认的下划线
  • underline:下划线
  • overline:上划线
  • line-through:中划线(删除线)


a元素有下划线的本质是被添加了text-decoration属性


2 text-align(重要)


定义行内内容(例如文字)如何相对它的块父元素对齐;


常用的值


  • left:左对齐(对于里面的文本,如果单行不满则右边空着)
  • right:右对齐(对于里面的文本,如果单行不满则左边空着)
  • center:正中间显示
  • justify:两端对齐(效果如下)


注意:text-align 只能让 (子元素 && 行内级元素)居中,如:img或文本


3 text-indent


text-indent用于设置第一行内容的缩进

text-indent: 2em; 刚好是缩进2个文字


4 text-transform


text-transform用于设置文字的大小写转换


text-transform有几个常见的值:


  • capitalize:(使…首字母大写, 资本化的意思)将每个单词的首字符变为大写
  • uppercase:(大写字母)将每个单词的所有字符变为大写
  • lowercase:(小写字母)将每个单词的所有字符变为小写
  • none:没有任何影响


5 word/letter-spacing


letter-spacing、word-spacing分别用于设置字母、单词之间的间距


  • 默认是0,可以设置为负数
目录
相关文章
|
3月前
|
前端开发
css的渐变属性linear-gradient
css的渐变属性linear-gradient
|
3月前
|
前端开发
CSS属性:盒子模型
CSS属性:盒子模型
33 0
|
3月前
|
前端开发
CSS属性
CSS属性
32 0
|
28天前
|
Web App开发 前端开发 iOS开发
css所有缩写属性,CSS属性简写整理
css所有缩写属性,CSS属性简写整理
23 1
|
3月前
|
前端开发
前端基础(五)_CSS文本文字属性、背景颜色属性
本文详细介绍了CSS中关于文本和背景颜色的样式属性。包括字体大小、字体族、字体加粗、字体样式、文本行高、`font`属性、文本颜色、文本对齐方式、文本装饰线、首行缩进等文本属性,以及背景颜色、背景图片、背景重复、背景位置等背景属性。文章通过示例代码展示了这些属性的具体应用和效果。
43 3
前端基础(五)_CSS文本文字属性、背景颜色属性
|
2月前
|
前端开发
CSS 中哪些属性可以继承
在 CSS 中,属性分为可继承与不可继承。可继承属性会在子元素中沿用父元素的样式设定。常见可继承属性包括:文本属性(如 `font-family`, `color`),列表属性(如 `list-style`),表格布局属性(如 `border-collapse`),以及其他如 `visibility` 和 `direction` 等属性。正确理解这些属性有助于更高效地进行样式设计。
|
28天前
|
前端开发
css简写属性
css简写属性
30 0
|
3月前
|
前端开发
【前端web入门第三天】02 CSS字体和文本
本文详细介绍了CSS中字体和文本的相关属性。字体部分涵盖字体大小、粗细、样式、行高、字体族及`font`复合属性,通过具体示例展示了如何设置和使用这些属性。文本部分则讲解了文本缩进、对齐方式、修饰线及文字颜色等属性,并提供了实用的代码示例。此外,还简要介绍了调试工具中的一些细节,如错误属性标识和属性生效状态的控制。
68 28
|
2月前
|
前端开发 JavaScript
如何在CSS中添加自定义属性
如何在CSS中添加自定义属性
16 0
|
2月前
|
前端开发
运用CSS伪类与属性,巧妙实现背景图片旋转效果
运用CSS伪类与属性,巧妙实现背景图片旋转效果
36 0