CSS的三种引入方式

一、内联式（行内式，即在body具体标签内写）

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>css三种引入方式</title>
</head>
<body>
    <!-- 内联式 -->
    <p style="color:red;">
        文本颜色为什么是红色
    </p>
</body>
</html>

 

二、嵌入式

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>css三种引入方式</title>
    <!-- 嵌入式 -->
    <style type="text/css">
        h3{
            colore:green;
        }
    </style>
</head>
<body>
    <!-- 内联式 -->
    <p style="color:red;">
        文本颜色为什么是红色
    </p>
    <h3>
        小猿圈
    </h3>
</body>
</html>

 

三、外部式

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>css三种引入方式</title>
    <!-- 嵌入式 -->
    <style type="text/css">
        h3{
            color:green;
        }
    </style>
    <!-- 外部式 -->
    <link rel="stylesheet" type="text/css" href="css/index.css">

</head>
<body>
    <!-- 内联式 -->
    <p style="color:red;">
        文本颜色为什么是红色
    </p>
    <h3>
        小猿圈
    </h3>
    <h4>
        大佬
    </h4>
</body>
</html>

 

posted @ 2020-03-02 14:37  南啾  阅读(261)  评论(0)  编辑  收藏  举报