典型代表,Div,h1-h6,p,ul,li
特点:
典型代表 span ,a, ,strong , em, del, ins
特点:
典型代表 input img
特点:
1.块元素转行内元素
display:inline
2.行内元素转块元素
display:block
3.块和行内元素转行内块元素
display:inline-block
块状元素特点:
内联元素特点:
内联块状元素特点:
display:block 可以将元素设置为块状元素
display:inline 可以将元素设置为内联元素
display:inline-block可以将元素设置为内联块状元素
每个HTML元素都会有盒子模型,如下图
[图片上传失败...(image-8891fd-1543076237898)]
可以看到,盒子模型中,一个标签是由内容,内填充(padding)、边框(border)、外边距(margin)组成的
一个元素的宽度=左边距+左边框+左填充+内容宽度+右填充+右边框+右边距
一个元素的高度=上边距+上边框+上填充+内容高度+下填充+下边框+下边距
CSS的选择器其实大类的话可以分为三类,即id选择器、class选择器、标签选择器。用法如下:
#id名
{
属性名:属性值
}
.class名
{
属性名:属性值
}
标签名
{
属性名:属性值
}
其中,他们之间又可以以不同的方式进行组合,如下:
后代选择器:
父代名
后代名
{
属性名:属性值
}
子代选择器:
父代名>子代名
{
属性名:属性值
}
群组选择器:
#name1,
.name2,
#name
div
{
属性名:属性值
}
伪类选择器:
name:伪类
通用(通配符)选择器:
*
{
属性名:
属性值
}……
常用的也就这些。