样式表 基础知识--写法、选择器

一、

<body>里写

<div style=" 300px;
height: 300px;
background-color: coral;">
</div>

二、
<body>里写<div id="a1"></div>
<head>里写 <style>
#a1{
300px;
height: 300px;
background-color: antiquewhite;
}
</style>
三、
<body>里写<div id="a2"></div>
<head>里写<link type="text/asp" rel="stylesheet" href="css/1.css"/>
新建css 写
#a2{
300px;
height: 300px;
background-color: aquamarine; }

四、class选择器
1、
<body>里写 <div class="a3"></div>
<head>里写 <style>

.a3{
300px;
height: 300px;
background-color: cornflowerblue;
}
</style>
2、(=name)随便命名也可以 *不常用
<body>里写 <div nb="a4"></div>
<head>里写
<style>
[nb=a4]{
300px;
height: 300px;
background-color: bisque;
}
</style>
3、 *:选取所有
<head>里写<style>
* {
margin: 0px;
padding: 0px;
}
</style>
4、并列选择器
<body>里写
<div class="c1"></div>
<div class="c2"></div>
<head>里写
<style>
.c1,.c2 {
400px;
height: 300px;
}
</style>
5、子代选择器
<body>里写
<div class="c3">
<span>AAAAAAAAAA</span>
</div>
<span>BBBBBBBB</span>
<head>里写
<style>
.c3 span {
color: black;
}
</style>
6、其他
<body>里写<div class="x1 x2"></div>
<head>里写
.x1 {
500px;
}
.x2 {
500px;
}


特别注意id class name

原文地址:https://www.cnblogs.com/little-rock/p/7361559.html