PHP初入,基础知识点整理(样式表&选择器的使用整理)

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>

/*全局设置,外边距*/
*{
margin: 0px;
padding: 0px;
}

/*id选择器*/
#d1{
width: 300px;
height: 200px;
background-color: greenyellow;
}

/*class选择器*/
.d3{
width: 300px;
height: 200px;
background-color: lightseagreen;
}

/*标签选择器*/
div{
border: solid black 5px;
}

/*不常用选择器*/
[name=N1]{
width: 300PX;
height: 100PX;
background-color: red;
}

/*并列选择器*/
.d4,.d5{
width: 300px;
height: 200px;
background-color: hotpink;
}

/*单独改字体,并不改其他的字体*/
.c6 span{
color: red;
width: 300px;
height: 200px;
}

/*并列选择器*/
.x1{
width: 300px;
}
.x2{
height: 200px;
}
</style>

<link type="text/css" rel="stylesheet" href="css/sdtyle1.css"/>
</head>

<body>
<!--第一种直接写--> <!--但是这种方式是最后用的-->
<div style="width: 300px; height: 200px; background-color: red;">这是第一种选择器</div>

<!--第二种用选择器-->
<div id="d1">这是第二种id选择器</div>

<!--第三种引入css文档-->
<div id="div2">这是第三种选择器</div>

<div class="d3"></div>
<!--选择器问题-->

<!--id name class-->
<!--不常用选择器-->
<div name="N1"></div>

<!--并列选择器-->
<div class="d4"></div>
<div class="d5"></div>

<!--子代选择器-->
<div class="c6">
<span>啦啦啦啦啦啦</span>
</div>
<span>啦啦啦啦啦</span>

<!--另类并列选择器x1和x2-->
<div class="x1 x2"></div>

<!--(敲黑板)优先级的问题,总的来说后面的代码优先级高-->

</body>
</html>

以上就是我学习和整理的内容,希望看到的同学对里面错误和不合适的地方进行指正,谢谢。

~~明天,又是充满希望的一天。

上一篇:codevs 1215 迷宫


下一篇:深入理解PHP Opcode缓存原理