day03

盒子模型margin,padding的传参

margin,padding参数规律:上(top) 右(right) 下(bottom) 左(left)
(100px)(10px 20px)(10px 20px 30px)(10px 20px 30px 40px)


12.png

h1-h6,p,div,ul,li,dl,dt,dd等块标签

特点:独占一行,能设置width,height

a span em strong等内联标签

特点:并排显示,不能设置width,height,margin-top,margin-bottom。

input img button 等内联块

特点:并排显示,能设置width,height。

CSS样式中使内联元素和内联块元素水平居中:

display:block;
margin-left:auto;
margin-right:auto;

不改变内联和内联块的display属性 实现水平居中

实现方案
parent element{
text-align:center;}

css选择器

定义:选定你所要改变的元素的一种方式。
分类:

(1).css元素选择器

文档的元素就是最基本的选择器
p{color:pink}

(2).class选择器

.test{color:yellow}

(3).id选择器

#first{color:blue}

(4).分组选择器

p,h4{background:gray}

(5).后代选择器

div>span{} //选取div所有子元素为span的标签
div p{}选择parent之后的所有P元素。

(6).兄弟选择器

div+p{}选取紧邻div之后的第一个兄弟元素
div~p{}选取紧邻div之后的所有兄弟元素

(7).伪类选择器

div:hover{}
input:focus{}

(8).伪元素

":before" 伪元素可以在元素的内容前面插入新内容
p:before{
content:“”}
":after" 伪元素可以在元素的内容之后插入新内容。
p:after{
content:“”}

(9).属性选择

div[class='test']{}

选择器的优先级别排序

hello world

元素选择器 div{color:pink}

你可能感兴趣的:(day03)