HTML网页制作:[17]CSS常用样式字体及颜色属性
CSS在网页中应用非常广泛,今天我就来分享一些关于文本的CSS样式属性。一起来学习一下吧!
操作方法
- 01
如图,比如我们有一段文字hello html!。
- 02
然后在浏览器中预览一下最初始的效果。
- 03
然后我们在网页中添加style标签,从而设置CSS样式。
- 04
如图,书写标签名加花括号,这里我使用的是p标签。如果你用的是其他标签,则修改为其他标签。
- 05
接着书写书写font-family,font-family是关于字体的属性,这里我设置成微软雅黑,你也可以设置成楷体,隶书等,注意要带上双引号哦。
- 06
接着再来预览,可以看到字体变成微软雅黑了哦。
- 07
再来书写属性font-size,这个属性是设置文本的大小的。这里我就设置成36px,px表示像素。数值越大则文字越大。
- 08
接着预览效果,就会发觉字号变大了。
- 09
接着设置font-style,这个属性是设置文本的风格,我设置的是斜体italic,默认是normal。
- 10
接着预览效果可以看到文字变成斜体了哦。
- 11
设置文本是否为粗体可以用属性font-weight,这里我设置为bolder,或者也可以设置成bold。
- 12
这样文字就会加粗了。
- 13
而color这个属性可以设置文本的颜色,这里我就设置成red红色了。你也可以设置成blue蓝色,orange橙色,pink粉色等。
- 14
最后,网页文本变成红色的了。
- 15
贴出源代码可以参考参考。 <!doctype html> <html lang="en"> <head> <meta charset="UTF-8" /> <title>Document</title> <style type="text/css"> p{ font-family: "微软雅黑"; font-size: 36px; font-style: normal; font-weight: bolder; color: red; } </style> </head> <body> <p>hello html!</p> </body> </html>