已解决
CSS---关于font文本属性设置样式总结
来自网友在路上 189889提问 提问时间:2023-11-20 00:02:44阅读次数: 89
最佳答案 问答题库898位专家为你答疑解惑
目录
1、color属性
2、font-size属性
3、font-weight属性
4、font-family属性
5、text-align属性
6、line-height属性
7、text-indent属性
8、letter-spacing属性
9、word-spacing属性
10、word-break属性
11、white-space属性
12、text-transform
12、writing-mode
13、text-decoration
1、color属性
// 颜色名,如【red】
// 十六进制值,如【#FFFFFF】
// RGB值,如【rgb(255, 0, 0)】
// rgba值,如【rgba(255, 0, 0, 0.9)】color: red;
color: #fff;
color: rgb(255,0,0);
2、font-size属性
1. 用于设置文本字体大小,可以设置为绝对大小,单位为px,也可设置为相对大小,单位为rem、em等
2. 字体大小未设置时,如果无父组件则默认16px; 如果父组件有字体大小则复用父组件字体大小;font-size: 16px;
font-size: 2em;
font-size: 2.5rem;
3、font-weight属性
- 用于设置文本的粗细,可设置的值有:
normal
标准字符(默认)bold
粗体字符bolder
更粗的字符lighter
更细的字符100、200、300、400、500、
600、700、800、900
400
相当于normal
700
相当于bold
数值越大字体越粗
4、font-family属性
- 用于规定文本使用的字体名或字体族名列表,字体名在列表越往前优先级越高。
如果浏览器不支持第一个字体,则会尝试下一个,以此类推font-family:"Times New Roman", "Georgia", "Serif";
5、text-align属性
用于设置文本的水平对齐方式,可设置的值有:默认值为leftcenter(居中对齐) left(左对齐) right(右对齐)
6、line-height属性
用于设置行间距,可设置的值如下:数字:行间距为当前字体大小乘此数字
固定值:设置固定的行间距,如20px
百分比:行间距为当前字体大小乘百分比按默认字体16px:
line-height:1; // 16px
line-height:20px; // 20px
line-height:50%; // (16*0.5) 9px
7、text-indent属性
- 用于指定首行缩进值,可设置的值如下固定值:设置固定首行缩进,如20px
百分比:首行缩进值为父元素宽度乘此百分比
text-indent:2em|20px;
text-indent:20%; // 0.2*100= 20px 100px为父盒子宽度
8、letter-spacing属性
用于设置字间距,设置固定值为字间距,如10px
normal默认字距,忽略任何其他字距属性<length>指定字符间距,可以用px、em、cm等单位inherit继承父元素的字符间距9、word-spacing属性
用于指定文本中单词之间的间距,设置固定值为单词间距,如10px
normal;默认值。表示单词间距与字母间距相同。word-spacing: length;用长度值表示单词间距。word-spacing: initial;重置该属性为它的默认值。word-spacing: inherit;从父元素继承该属性。10、word-break属性
对英文单词处理
注意:break-all
和 break-word
会破坏单词的完整性,可能会影响阅读体验,要谨慎使用。
11、white-space属性
用于设置文本的空白符处理方式,属性值如下
12、text-transform
用于设置文本大小写字母,常用属性如下
12、writing-mode
设置文本在水平或垂直方向的排布方式
13、text-decoration
用于设置文本的装饰线,是下表属性的简写
(下划线、上划线、删除线)。underline下划线overline上划线line-through删除线text-decoration-color颜色名、十六进制颜色、rgb等设置装饰线颜色text-decoration-stylesolid实线设置装饰线的样式double双实线dotted点划线dashed虚线wavy波浪线
查看全文
99%的人还看了
相似问题
- SpringBoot使用ObjectMapper之Long和BigDemical类型的属性字符串处理,防止前端丢失数值精度
- 〖大前端 - 基础入门三大核心之JS篇㊲〗- DOM改变元素节点的css样式、HTML属性
- QT中样式表常见属性与颜色的设置与应用
- Java继承中的属性名相同但是类型不同的情况
- C#开发的OpenRA游戏之属性QuantizeFacingsFromSequence(7)
- XmlElement注解在Java的数组属性上,以产生多个相同的XML元素
- CSS-列表属性篇
- CSS 文本属性篇
- 计算属性与watch的区别,fetch与axios在vue中的异步请求,单文本组件使用,使用vite创建vue项目,组件的使用方法
- JAXB:用XmlElement注解复杂类型的Java属性,来产生多层嵌套的xml元素
猜你感兴趣
版权申明
本文"CSS---关于font文本属性设置样式总结":http://eshow365.cn/6-39780-0.html 内容来自互联网,请自行判断内容的正确性。如有侵权请联系我们,立即删除!
- 上一篇: 小迪笔记(1)——操作系统文件下载反弹SHELL防火墙绕过
- 下一篇: C语言实现冒泡排序(超详细)