css基础知识总结

什么是css

css即层叠样式表,用于控制网页数据的表现,使得网页数据和表现控制分离。

css引入的是四种方式

行内式

行内式就是在标签内部的style属性编辑控制方式。这种方式,不能体现css的优势,不推荐!

<p style="background-color: rebeccapurple">hello css</p>

嵌入式

嵌入式指的是在head标签中,嵌入style标签控制对应的标签

<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        p{
            background-color: rebeccapurple;
        }

    </style>
</head>

链接式

<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="1.css">
</head>

导入式

同样在head标签中嵌套style,然后在style里导入css文件链接

<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        @import "1.css";
    </style>
</head>

注意:使用导入式,css是在整个页面都加载后再导入的,这样就可能导致网页在一个短时间内处于杂乱的状态。但是链接式不一样,他是在加载网页内容前,先导入的,所以不存在这个问题。

css选择器

css选择器是指如何去选择具体的某个标签,然后去实现控制。
1.基础选择器

*:通用元素选择器,控制所有的标签
*{background-color: rebeccapurple}
E:标签选择器,控制所有该标签的样式
p*{background-color: rebeccapurple}
.info class选择器 也可以具体指定某个标签下的选择器 E .class
.abc{background-color: rebeccapurple}
div .abc{background-color: red}
#info E #info id 选择器。 ID是唯一的,class也可以不唯一。
#abc{background-color: rebeccapurple}
div #abc{background-color: red}

猜你喜欢

转载自www.cnblogs.com/linshuhui/p/9756811.html