A今日所学

标签

块标签：div,h1~h6,p,ul,li,dl,dt,dd
特点：独占一行，能够设置宽高
属性：display：block

内联标签：a，span，em，strong（行内标签）
特点：并排显示，不能设置宽高，不能设置margin-top，margin-bottom
属性：display：inline；

内联块：button，img，input（行内快）
特点：并排显示，可以设置宽高
属性：display：inline-block

让内联元素和内联块元素水平居中
方法一：
display：block
margin-left：auto；
margin-right：auto；
方法二：
给父类加text-align：center；

<a href="#">aa</a> #为跳转至当前页面顶部
<a href="#+id名">aa</a> 跳转至当前页面中id为顶部
  如<a href="#aaa">aa</a> 跳转至id为aaa的元素

p{}*n在语法后按tab直接写出n个p标签 {}内写内容
p{a$$}*n $为依次增长
div>p{}*n 在div中写n个p标签
div{}*n>p{} 写n个<div><P></p></div>

CSS选择器

分组选择器:
div,p{}     可选多个用，隔开

元素名可用class名
后代选择器：
选择 父类元素<div> 元素内部的所有后代 <p> 元素
div p{}  如div p{ color:red;}p所有的后代p字体为红色
子代选择器：
选择 父类元素<div> 元素内部的所有子代 <p> 元素
p>p{} 如：p>p{color:red;}p的所有子代p字体为红色

兄弟选择器：
选择<p>元素后所有元素为<p>的元素
p~p{}  如p~p{color:red;}所选p后的同一等级所有p字体为红色
选择<p>元素后第一个元素且为<p>的元素
P+P{}  如：p>p{color:red;} p后第一个元素为p字体为红色，若不为p则不变；

属性选择器：
div[class="text"]{} 选择class属性为text的div元素
p:nth-child(数字或表达式){} 选择第n个p元素
p：not（nth-child：（数字或表达式））{} 选择除了第n个p元素外的p元素

伪元素：写在css中
div：before{}  在div内元素前 content一定要写
如：div:before{
        content: "大大大所";
        color: red;
        background-color: green;
        display: inline-block;
        height: 100px;
        width: 100px;
    }
div：after{} 在div内元素后    原理同上

B 所掌握的有

全部已掌握