<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>练习字体的修饰</title> <style> #aa{ color: blue; font-style: italic;/*控制字体的样式*/ /*normal 默认值。浏览器显示一个标准的字体样式。 italic 浏览器会显示一个斜体的字体样式。 oblique 浏览器会显示一个倾斜的字体样式。 inherit 规定应该从父元素继承字体样式。*/ font-variant: small-caps;/*控制文中字母的大小写*/ /*normal 默认值。浏览器会显示一个标准的字体。 small-caps 浏览器会显示小型大写字母的字体。 inherit 规定应该从父元素继承 font-variant 属性的值。*/ font-weight: bold;/*控制文本的粗细*/ /* normal 默认值。定义标准的字符。 bold 定义粗体字符。 bolder 定义更粗的字符。 lighter 定义更细的字符。*/ font-size: 20px; /*控制字体的大小*/ line-height: 40px;/*控制行高*/ /*normal 默认。设置合理的行间距。 number 设置数字，此数字会与当前的字体尺寸相乘来设置行间距。 length 设置固定的行间距。 % 基于当前字体尺寸的百分比行间距。 inherit 规定应该从父元素继承 line-height 属性的值。*/ font-family: 'simHei'; /*规定字体*/ } #bb{ font: italic small-caps bold 23px/45px 'simHei'; } </style> </head> <body> <div id="aa"> 唔，今天下午打算和padding相伴等待中秋的月亮了，月兔你能送盒月饼给我咩 正题，刚刚无意间又看到了张鑫旭老师讲的关于padding的奇思妙想，学到了一些新的东西，来给大脑做个笔记。</div> <div id="bb">Myjdf jhfi fhakfj hfidshf fdshf fshfh efh fhfh f hf.</div> </body> </html>
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>练习字体设置</title> <style> #aa{ font-family: '无衬线字体','微软雅黑','黑体',sans-serif;//sans-serif表示无衬线字体类 } #bb{ font-family: 'New Times','新宋体',serif;//serif表示有衬线字体 } </style> </head> <body> <div id="aa">离离原上草，一岁一枯荣。<br/> 野火烧不尽，春风吹又生。</div> <div id="bb">离离原上草，一岁一枯荣。<br/> 野火烧不尽，春风吹又生。</div> </body> </html>
