web第三课

行级元素

行级元素：只占以一小块空间，后面可以继续放内容

行级元素也称为行内标签，内联标签，使用块级元素将网页结构搭建好了后，使用行级元素来进行排版

块级元素

块级元素：独占一行，块级后面的元素无法再放任何的内容。

从页面布局和外观显示来看，一个网页的布局就类似于一篇报纸的排版，首先将网页分成大的模块，然后在模块里面再分成小的模块，所以块级元素多用来布局。

区别：：

1，块级元素独占一行，比较霸道，行级元素共享一行！

2，块级元素支持高和宽，行级元素不支持高和宽。行级元素的高和宽由内容来决定

3，块级元素常常作为容器，可以容纳其他的行级元素和块级元素，行级元素一般用来组织内容，即容纳文字，图片，图片，超链接

块级元素(标签): div ， p , h , hr, table, ul, ol, form

行级元素(标签)： a, span, label, input, textarea(文本域), br, img,

将块级元素转换成行级元素 假设现有两个div标签

div{

/* block 将元素转换何成块级元素*/

inline 将模块转换为行级

inline-block 块级元素按照行级标签排列，但是它具有会计标签的属性

第一种dispaly:inline-block;

第二种float:left 横着排列

}

隐藏内容 dispaly:none;..................

padding :20px 30px 40px

一个参数代表四周

两个参数： 第一个代表上下 第二个代表左右

三个参数：上左下右

四个：上右下左 顺时针

如果父类(包裹在他外面的)没有边框（border） 设置里面的那个离上面的那个30px 他会将值传递个外面的那个盒子，这个值就会被设置为离页面的边框的距离 ！ 然而里面那个盒子离外面那个盒子还是之前的距离！！

| important 设置最高的优先级

•