【重构笔记Vol.1】H5页面中字体加粗

Posted 2023-04-18

参考技术A 以ios9为例，默认的 font-weight 值是 400-500

所以应需求的不同font-weight的值分别是：

细：＜400

粗：≥400 （默认）

加粗：＞600

下面看三个示例便一目了然：

所以一般情况下：

默认字体：400（或者不做任何设置）

加粗：700+

部分需要极细的设计需求：300

代码笔记8

　　　　　　第五章 css的常用属性

　　　　　　1. span标签
　　　　　　突显，强调局部文字的作用.
　　　　2.字体样式
　　　　　　font-size: 字体大小
　　　　　　font-style:normal,italic(倾斜)
　　　　　　font-weight:normal,bold(加粗)
　　　　　　font-familty:字体类型(楷体)
　　　　　　font:样式 粗细 字体大小 字体类型.
　　3.文本样式
　　　　　　color: 文本样式
　　　　　　text-align: 水平对齐方式(left,center,right)
　　　　　　text-indent: 首行缩进
　　　　　　line-height: 行高
　　　　　　text-decoration: 文本装饰
　　　　　　(underline,overline,line-through)
　　　　　　vertical-align: 垂直对齐方式(top,middle,bottom)
　　　　　　text-shadow: 颜色 x轴偏移量 y轴偏移量 阴影模糊范围; //文本阴影
　　　　　4.超链接伪类样式
　　　　　　a:link //未点击访问过样式
　　　　　　a:visited //访问过样式
　　　　　　a:hover //鼠标悬浮样式
　　　　　　a:active //鼠标按下未松开样式
　　　　　5.列表样式
　　　　　　list-style-type: cricle..
　　　　　　list-style-image: url(图片路径)
　　　　　　list-style-position:inside|outside 样式位置.
　　　　　6.背景样式
　　　　　　　background-color: 背景颜色
　　　　　　　background-imgage:url(图片路径)
　　　　　　　background-repeat:no-repeat,repeat..(图片重复方式)
　　　　　　　background-position:px,百分比,left..(图片位置)
　　　　　　　background:颜色 图片 位置 重复方式
　　　　　　　background-siez:cover(充满背景)|contain (图片尺寸)
　　　　7.渐变
　　　　　　　　backgournd:linear-gradient(渐变方向,开始颜色,结束颜色)

　　　　　　　　注意:兼容性
　　　　　　　　　　E浏览器是Trident内核，加前缀：-ms-
　　　　　　　　　　Chrome浏览器是Webkit内核，加前缀：-webkit-
　　　　　　　　　　Safari浏览器是Webkit内核，加前缀：-webkit-
　　　　　　　　　　Opera浏览器是Blink内核，加前缀：-o-
　　　　　　　　　　Firefox浏览器是Mozilla内核，加前缀：-moz-
　　　　　　　　例:
　　　　　　　　　　background:-webkit-linear-gradient(left bottom,red,blue);