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

相关推荐
Jackson__21 分钟前
Agent Skill 和 Rules 有什么区别?
前端·agent·ai编程
不要卷鸿蒙啊24 分钟前
【鸿蒙开发】HMRouter一款和好用的管理路由三方工具
前端·harmonyos
李剑一25 分钟前
数字孪生大屏必看:Cesium 3D 模型选中交互,3 种高亮效果拿来就用!
前端·vue.js·cesium
Lee川30 分钟前
CSS 几何美学:从基础图形到创意绘制的艺术之旅
css
奶昔不会射手1 小时前
自定义vue3函数式弹窗
前端·javascript·css
new code Boy1 小时前
前端全栈之路
前端
牛奶1 小时前
为什么敲几个字母就能访问网站?DNS原理大揭秘
前端·http·dns
wuhen_n1 小时前
破冰——建立我们的AI开发实验环境
前端·javascript
HelloReader1 小时前
Flutter 自适应布局一套代码适配手机和平板(十二)
前端
牛奶1 小时前
HTTP裸奔,HTTPS穿盔甲——它们有什么区别?
前端·http·https