css学习Day01

css学习Day01

css语法

选择器{

​ 声明1；

​ 声明2；

​ 声明3；

}

一、css四种导入方式

  • 行内样式

    <h1 style="color:red">
    标题
</h1>

  • 内部样式

    <head>
    <style>
        h1{
            color:green
        }
    </style>
</head>

  • 外部样式

    链接式：

    <link rel="stylesheet" href="css文件地址">

    优先级：就近原则（谁离元素更近用谁的）

    拓展：

  • 外部样式（2）

    导入式（css2.1版本，不建议使用，在大网页时会出现先出现骨架再出现渲染）：

    <head>
    <style>
        @import url("css地址")
    </style>
</head>

二、选择器

作用：选择页面上的某一个元素

  • 标签选择器

    <head>
   <style> h1{
    color="red"
    }</style>
</head>   
<body>
    <h1>
        标题
    </h1>
</body>

  • 类选择器

    好处：可以多个标签归类，时同一个class，可以复用

    <head>
   <style>  <!--类名可以随意取-->
       .class{       
           
       }
    </style>
</head>
<body>
    <h1 class="类名">
        标题
    </h1>
</body>

  • id选择器

    （id必须保证全局唯一！不可复用）

    <head>
   <style>  
       #id名称{
           
       }
    </style>
</head>
<body>
    <h1 id="  ">
        标题
    </h1>
</body>

    优先级：id选择器>class选择器>id选择器

posted @ 2023-07-22 17:20  wi_z  阅读(13)  评论(2)    收藏  举报