一、标签嵌套规则
块级标签能够嵌套某些块级标签和内联标签(行内标签)
内联标签不能块级标签,只能嵌套内联标签
块级标签能够设置高度和宽度
内联标签不能设置,设置没有效果
二、Css样式
高度宽度:
Width:100px
Height:100px
字体:
Font-family:’宋体’
Font-size:10px; 默认大小是16px
Font-weight:bold; 自重 粗细 bold加粗
Color:red;rgb(255,255,255) rgba(255,255,255,0.3) 0.3是色彩透明度 两位重重复的可简写#ffffff ==> #fff
文字对齐方式:
Text-align:center,right,left
文字装饰,
Text-decoration:none;//underline,line-through去除横线 多用于a标签
首行缩进
Text-indent:32px;缩进两个字符
背景属性
背景颜色
Background:url(‘路径’) no-repeat right top(200px,200px)
Display:
Display:none;隐藏标签
Visibility:hidden;隐藏标签,但是保留标签所占位置
Display:block;将内联标签改为块级标签
Display:inline;将块级标签改为内联标签
Display:inline-block;将块级标签或者内联标签,改成块级标签和内联标签的属性,也就是不独占一行,可以设置高度和宽度
Box-model:
Content： 里面的内容 高度宽度就是我们设置width和height
Padding:内边距(内填充)
Padding-left
Padding-right
Padding-top
Padding-bottom
Border: 边框
border-bottom:1px solid blue;
border-right:1px solid orange;
border-top: 2px solid red;
border-left: 3px dashed orange;
/*border: 3px orange;*/
Margin 外边距,距离其他标签的距离,两个标签如果都设置了margin,那么两个标签之间的距离取最大的那个margin
Margin-left:距离左边边框
margin-top:距离上面边框
Margin-right:距离右侧边框
Margin-bottom:距离底部边框
标签占的宽度:content宽度+左右padding + 左右边框的距离