前端一HTML:二十CSS的三种存在方式

1. 行内样式(存在于标签之中,用style属性设置)

<p style="color:red">这是内容</p>

2. 嵌入样式(也称内联样式, 存在于title标签之下的style标签之中)

<style type="text/css">
        p{
            color: red;
        }
</style>

3. 外部样式:(也称外联样式,存在于一个外部文件中)

  <link rel="stylesheet" href="CSS文件.css">

 一般css使用第二种,第三种方式的比较多。

 补充一:优先级:

   !important > 行内样式 > id > class > 标签 > 通配符 > 继承 > 默认

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <link rel="stylesheet" href="CSS文件.css">
   
    <style type="text/css">
        p{
            color: red;
        }

        #content{
            color: blue;
        }

        .content{
            color: yellow !important;
        }
    </style> 
</head>
<body>
     <p class="content" id="content" style="color:pink">这是内容</p>
</body>
</html>

 补充二:请求带有css外部样式的页面.

  如果页面上存在css的外部样式,那么将来浏览器在解析到这一段内容的时候会再发送一条请求去请求服务器.

  

 补充三: 请求css外部样式的过程与页面下面标签解析是同时进行的。 

猜你喜欢

转载自blog.csdn.net/m0_37564426/article/details/89669849
今日推荐