2021.01.20css样式表的建立

最新推荐文章于 2021-10-25 11:03:01 发布

at呆呆酱

最新推荐文章于 2021-10-25 11:03:01 发布

阅读量142

点赞数

本文链接：https://blog.csdn.net/m0_54087529/article/details/112913835

版权

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
   <style>
       /* 选择器（声明） */
       p{
           width: 100px;
           height: 100px;
           background: red;
       }
   </style>
   <style>
       @import url(css/01-index.css);
   </style>
   <!-- <link rel="stylesheet" href="" type="text/css"> text为了避免错误 type属性可以删除，没影响， -->
   <!-- <link rel="stylesheet" href="css/01-index.css"> -->
</head>
<body>
    <!-- 宽高和背景颜色 -->
    <div style="width: 100px;height: 100px;background-color: green;"></div>
    <p></p>
    <h1></h1>
</body>
</html>


<!-- css样式表的建立方式：行内/内嵌/内联、内部样式、外部样式表
       1.行内样式表的建立方式
            - 是添加在标签内部的
            - <div style="css声明">
            - 在css中要接单位

        2.内部样式表的建立方式
             - 是在head标签内添加的
             - 在head标签内添加style标签
             - 在style标签内书写css组成即可

        3.外部样式表
            第一种：link
                   - 在head标签内添加的
                   - 添加link标签
                   - 在外面新建一个css样式文件
            第二种： @import url("");
                   - 在heada标签内添加
                   - 在style标签内添加
            这两种外部样式表的引入该如何去使用？
              区别：
                    - 用link标签引入css样式的时候，html和css在浏览器解析的时候同时加载
                    - 用@import引入外部样式表的时候，先加载html后加载css样式表
-->

在这里插入图片描述

at呆呆酱

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
2021.01.20css样式表的建立

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> /* 选择器（声明） */
复制链接

扫一扫