CSS中文本属性使用详情

1.文本修饰

1.1.属性名:

text-decoration

1.2.可选值:

none: 无装饰线

underline: 下划线

overline: 上划线

line-through: 删除线

可搭配如下样式

dotted: 虚线

wavy: 波浪线

也可以指定颜色.

2.文本缩进

2.1.属性名:

text-indent

2.2.属性值:

css中的长度单位,例如:px

3.文本对齐方式

3.1.属性名:

text-align

3.2.属性值:

left: 左对齐(默认值)

right:右对齐

center:居中对齐

4.行高

4.1.属性名:

line-height

4.2.可选值:

normal:有浏览器根据文字大小决定的一个默认值.

像素(px):

数字: 参考自身font-size的倍数(很常用).==>1.5

百分比: 参考自身font-size的百分比.==>150%

备注:由于字体设计原因,文字在一行中,并不是绝对垂直居中,若一行中都是文字,不会太影响美感.

4.3.行高注意事项:

1.line-height 过小会造成文字重叠,且最小值是0,不能为负数.

2.line-height 是可以继承的,且为了能更好的呈现文字,最好写数值.

3.line-height 和height是什么关系?

3.1.设置了height,那么高度就是height的值.

3.2.不设置height的时候,会根据line-height计算高度.

5.文本垂直对齐方式:

5.1.属性名:

vertical-align

5.2.作用:

用于指定同一行元素之间,或表格单元格内文字的垂直对齐方式

5.3.常用值:

1.baseline (默认值):使元素的基线与父元素的基线对齐.

2.top 使元素的顶部与其所在行的顶部对齐

3.middle 使元素的中部与父元素的基线加上父元素字母x的一半对齐.

4.bottom 使元素的底部与其所在行的底部对齐.

5.4.特别注意:

vertical-align不能控制块级元素.

相关推荐
_codemonster16 分钟前
npm run dev 是在开发模式运行,怎么在生产环境运行
前端·npm·node.js
kyriewen42 分钟前
我受够了复制报错去问 AI,花一下午给控制台做了个调试助手
前端·javascript·ai编程
IT_陈寒2 小时前
Redis的DEL命令竟然没删掉数据?我踩的这个坑你得知道
前端·人工智能·后端
anOnion2 小时前
构建无障碍组件之Menu and Menubar Pattern
前端·html·交互设计
JavaGuide2 小时前
我用 Claude Code/ZCode+GLM-5.3 从零做了一款 Agent 游戏!
前端·后端
Eason_Lou2 小时前
vue flow使用注意事项
前端·vue.js
小赵同学WoW3 小时前
1-2 TypeScript 中的 `any` 与 `unknown`
前端
six_3 小时前
C# 上位机(持续更新中)
前端·面试·c#
风雨_3 小时前
Git Worktree sourcetree完整使用指南
前端
半个落月3 小时前
React 组件通信进阶:useContext 与自定义 Hook 实战详解
前端·react.js