要做个公司网站的方案费用,公众号运营一年多少钱,设计公司营销策略,卫浴网站模板3.1字体系列
CSS使用font-family属性定义文本的字体系列。
p{font-family:微软雅黑}
div{font-family:Arial,Microsoft Yahei,微软雅黑}
3.2字体大小
css使用font-size属性定义字体大小 p{ font-size:20px; } px(像素)大小是我们网页的最常用的单…3.1字体系列
CSS使用font-family属性定义文本的字体系列。
p{font-family:微软雅黑}
div{font-family:Arial,Microsoft Yahei,微软雅黑}
3.2字体大小
css使用font-size属性定义字体大小 p{ font-size:20px; } px(像素)大小是我们网页的最常用的单位谷歌浏览器默认的文字大小为16px;不同浏览器可能默认显示的字号大小不一致我们尽量给一个明确值大小不要默认大小。可以给body指定整个页面文字大小。
!DOCTYPE html
html langen
headmeta charsetUTF-8meta nameviewport contentwidthdevice-width, initial-scale1.0titleCSS字体属性之字体大小/titlestylebody {font-size: 16px;}/* 标题标签化比较特殊需要单独指定文字大小 */h2 {font-size: 16px;}/style
/head
bodyh2pink的秘密/h2p那一抹众人中最漂亮的颜色/pp优雅淡然又那么心中清澈。/pp前端总是伴随着困难和犯错/pp静心坦然攻克一个又一个。/pp拼死也要克服它/pp这是pink的秘密也是老师最终的嘱托。/p
/body
/html
3.3 font-weight字体粗细
!DOCTYPE html
html langen
headmeta charsetUTF-8meta nameviewport contentwidthdevice-width, initial-scale1.0titleCSS字体属性之字体大小/titlestyle.bold {/* font-weight:bold; *//* 这个700bold *//* 实际开发中我们更提倡使用数字表示加粗或者变细 */font-weight: 700;}h2 {font-weight: 400;/* font-weight:normal */}/style
/head
bodyh2pink的秘密/h2p那一抹众人中最漂亮的颜色/pp优雅淡然又那么心中清澈。/pp前端总是伴随着困难和犯错/pp静心坦然攻克一个又一个。/pp classbold拼死也要克服它/pp 这是pink的秘密也是老师最终的嘱托。/p
/body
/html
属性值描述normal默认值(不加粗的)bold定义粗体加粗的100-900400等同于normal,而700等同于bold 注意这个数字后面不跟单位
学会让加粗标签比如h和strong等不加粗或者其他标签加粗
实际开发时我们更喜欢用数字表示粗细
3.4 字体样式
css使用font-style属性设置文本的风格 p{ font-style:normal; } 属性值作用normal默认值浏览器会显示标签的字体样式 font-style:normalitalic浏览器会显示斜体的字体样式
注意平时我们很少给文字加斜体反而要给斜体标签(em,i)改为不斜体字体。
3.5 字体复合属性
body { font:font-style font-weight font-size/line-height font-family;
}
使用font属性时必须按上面语法格式中的顺序书写不能更换顺序并且各个属性间以空格隔开
不需要设置的属性可以省略取默认值但必须保留font-size和font-family属性否则font属性将不起作用。
!DOCTYPE html
html langen
headmeta charsetUTF-8meta nameviewport contentwidthdevice-width, initial-scale1.0titleCSS字体属性之字体大小/titlestyle.fuheziti{font: italic 700 16px microsoft yahei;}/style
/head
bodyh2pink的秘密/h2p那一抹众人中最漂亮的颜色/pp优雅淡然又那么心中清澈。/pp前端总是伴随着困难和犯错/pp静心坦然攻克一个又一个。/pp classfuheziti拼死也要克服它/pp 这是pink的秘密也是老师最终的嘱托。/p
/body
/html
实现效果
