当前位置： 移动技术网 > IT编程>网页制作>CSS > 前端学习笔记（3）之css文本属性合集

前端学习笔记（3）之css文本属性合集

2020年07月24日  | 移动技术网IT编程  | 我要评论

文本模块

缩进text-intent

首行缩进：text-intent：2em；
悬挂式缩进 text-intent：-999px；

间距 xxx-spacing

字间距 letter-spacing
词间距word-spacing

控制文本大小写 text-transform

属性值：

capitalize 首字母大写
uppercase 大写
lowercase 小写

文本修饰 text-decoration

属性值：

none
underline 下划线
outline 上划线
line-through 划线穿过文本

水平对齐方式text-align

属性值：

left center right justify(两端对齐)

垂直对齐方式vertical-align

（不只限于文本）

top 顶对齐 middle 居中对齐 bottom 底对齐 baseline基线对齐

文本加粗 font-weight

属性值：

normal bold bolder 100-900

控制文本倾斜font-style

属性值：

normal italic oblique

文本换行处理

  • 默认执行逻辑：对于长单词，如果超出，首先尝试把长单词放到下一行显示，如果下一行仍有超出则不做处理。
  • word-wrap：break-word；执行逻辑：对于长单词，如果超出，尝试把它放到下一行，如果下一行仍有超出，把超出部分放到下一行。
  • word-break：break-all；（粗暴断句）执行逻辑：不会考虑把长单词换到下一行，而是直接在单词内部断句。

解决input的border内嵌问题

input的border是长在input内部的，因此在给input设置border时，一般在input外面套一个div，把div的border作为input的属性来用。

列表符号（不常用）

控制列表符号list-style-type：；disc circle none …
把图片当作列表符号list-style-image：url（）；
图片的位置 list-style-position 属性值 inside outside

一般选择去掉列表符号：

list-style：none；

本文地址：https://blog.csdn.net/qq_42698576/article/details/107545740

您可能感兴趣的文章:

如对本文有疑问， 点击进行留言回复！！

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网