一、CSS基本用法

(CSS: Cascading Style sheet)

样式引用

行内样式

CSS写在html文件中的body里面

例如:

<body>
    <p style="color:red;">五星红旗的底色是红色的,上面的五个<sapan style="color:yellow;">星星</sapan>是黄色的
    </p>
</body>

image-20210924092831531

内嵌式

CSS写在HTML文件中的\里面

例如:

<head>
    <style type="text/css">
        h1{
            color:lawngreen;
            font-size:5em;
            font-weight:700;
            font-style:oblique;         
        }
        p{
            color:aqua;
            font-size:2em;
            font-size:300;
        }
    </style>
</head>
<body>
    <h1>内嵌式css的演示</h1>
    <p>内嵌式css的作用只是局限于嵌入了样式表的单一HTML</p>
</body>

image-20210924094154432

链接式

(先加载CSS,再渲染页面)推荐的方式,将CSS语言分离出来,和HTML文本语言分装在两个文件里,语言不混淆,更易于查看和编辑。

建立一个和.html文件在同一目录的文件夹,并将.css文件放在该文件夹中。

image-20210924100553240

然后将CSS操作放在.css文件中,例如:

h1{
    color:darkred;
    text-align:center;
    font-weight:900;

}
p{
    color:chartreuse;
    font-size:1.2em;
}

.css文件里只用写如上这些,直观的把操作写出来,不需要写\

发表评论

🎲