【前端开发】:使用CSS中的ID选择器编写Google字体样式

ID选择器和class类选择器的不同是:每一个ID只能够被html调用一次,而css当中所编写的class则可以被html调用多次,我们使用ID选择器编写一个谷歌样式的字体,如果需要选择同样的颜色,则需要更换不同的id名称,使用class类选择器编写谷歌字体样式的网页如下:

https://www.cnblogs.com/geeksongs/p/14356090.html

当前使用ID选择器编写之后的式样如下:

 

 代码入下:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>谷歌</title>
    <style>
    span
    {
    font-size:100px;
    }
    /#自定义的class需要在前面加上句号,也就是“.”,已经具有标签就不需要加上英文里的句号了!#/
        #red
        {
        color:red;
        }
        #red_two
        {
        color:red;
        }
        #green
        {
        color:green;
        }
        #blue
        {
        color:blue;
        }
        #blue_two
        {
        color:blue;
        }
        #yello
        {
        color:yellow;
        }
    </style>
</head>
<body>
<span id="blue">G</span>
<span id="red">o</span>
<span id="yello">o</span>
<span id="blue_two">g</span>
<span id="green">l</span>
<span id="red_two">e</span>
</body>
</html>

 

posted @ 2021-02-01 13:32  Geeksongs  阅读(255)  评论(0编辑  收藏  举报

Coded by Geeksongs on Linux

All rights reserved, no one is allowed to pirate or use the document for other purposes.