更新时间:2022-01-26 06:12:07
文字样式,顾名思义,就是通过各种CSS去调整文字的样式,从而创造出各式各样的文字效果。 在看完这部分的视频后,一个很明显的感觉:这好像是网页版的word一样。我们平时在Word中调整文字样式,现在是在CSS中调整各种在网页上显示的文字样式。 先看看在哪些方面可以做出调整: 1.字体 2.文字大小 3.文字颜色 4.文字粗细 5.斜体 6.下划线、顶划线和删除线 7.英文字母大小写 【实例应用】 最后,就不妨看看Google的标签是如何做出来的吧。 1.页面框架 2.调整字体 3.调整颜色 【具体代码】
<html> <head> <title>Google</title> /*标题*/ <style> p{ font-size:80px; letter-spacing:-2px; /*字母间距*/ font-family:Arial,Helvetica,sans-serif; /*字体*/ } .g1,.g2{color:#184dc6;} /*各字母颜色设置*/ .o1,.e{color:#c61800;} .o2{color:#efba00;} .l{color:#42c34a;} </style> </head> <body> <p><span class="g1">G</span><span class="o1">o</span><span class="o2">o</span><span class="g2">g</span><span class="l">l</span><span class="e">e</span></p> </body> </html>
在做实例的时候,想起来以前敲百例的时候,也是很简单的代码,自己一边实现一边学习。现在学习CSS,有着当时的感觉,简简单单的实例和代码,也是需要自己多去实践才行。