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不能控制块级元素.

相关推荐
JarvanMo20 分钟前
2025 年真正有效的 App Store 优化(ASO)
前端·ios
{⌐■_■}22 分钟前
【JavaScript】前端两种路由模式,Hash路由,History 路由
前端·javascript·哈希算法
前端老鹰24 分钟前
HTML `<datalist>`:原生下拉搜索框,无需 JS 也能实现联想功能
前端·html
玲小珑26 分钟前
LangChain.js 完全开发手册(五)Runnable 接口与任务编排系统
前端·langchain·ai编程
江城开朗的豌豆43 分钟前
解密useEffect依赖数组
前端·javascript·react.js
江城开朗的豌豆1 小时前
React Hooks必杀技:前端工程师小杨带你玩转常用API!
前端·javascript·react.js
江城开朗的豌豆1 小时前
Redux状态更新:异步还是同步?
前端·javascript·react.js
前端小巷子1 小时前
Vue 项目性能优化实战
前端·vue.js·面试
Aphasia3111 小时前
useEffect 中Clean up 函数的执行机制
前端·react.js·面试