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

相关推荐
excel几秒前
使用 Canvas 实现扫描效果:宽度计算、透明度控制与旋转
前端
MC丶科2 分钟前
Spring Boot + Vue 实现一个在线商城(商品展示、购物车、订单)!从零到一完整项目
前端·vue.js·spring boot
q***498637 分钟前
分布式WEB应用中会话管理的变迁之路
前端·分布式
IT_陈寒1 小时前
JavaScript性能优化:10个V8引擎隐藏技巧让你的代码快30%
前端·人工智能·后端
前端加油站2 小时前
Chrome/Firefox 浏览器扩展开发完整指南
前端·chrome
码途进化论2 小时前
从Chrome跳转到IE浏览器的完整解决方案
前端·javascript
笙年2 小时前
Vue 基础配置新手总结
前端·javascript·vue.js
哆啦A梦15882 小时前
40 token
前端·vue.js·node.js
炫饭第一名2 小时前
Cursor 一年深度开发实践:前端开发的效率革命🚀
前端·程序员·ai编程
摇滚侠2 小时前
Vue 项目实战《尚医通》,获取挂号医生的信息展示,笔记43
前端·javascript·vue.js·笔记·html5