【前端面试题4】

1.行属性，块属性，行块属性特点及其包含哪些标签

1.1块属性：

上下排列，独占一行

支持设置宽高，如果不设置宽高，宽度自动撑满父容器，高度由内容决定

div，p，h1—h6，ol>li

1.2行属性：

左右排列

不支持设置宽高

不支持上下的marign和padding

a,span

1.3行块属性：

左右排列

支持设置宽高

img

2.alt,title,src标签的含义

alt：图片加载失败提示音

title：鼠标移入提示音

src：用来放置图片地址

3.盒模型包括什么，正常盒模型和怪异盒模型区别

盒模型包括：width+height+marign+padding+border

区别：

正常盒模型设置padding和border会增大盒模型面积

怪异盒模型设置padding和border会挤压内容区

4.margin存在的问题

4.1上下两个元素同时设置margin-top和margin-bottom会叠压取最大值

4.2第一个子元素的margin-top会传递给父元素

5.浮动的作用：

让块属性标签排成一行，解决水平布局问题

让行属性标签支持设置宽高

文字环绕效果

6.浮动存在的问题及解决方式

存在问题：父元素不设置高度的情况下，高度由子元素撑开，一旦子元素设置浮动，父元素会失去高度进而影响后面元素布局

解决方式：

给父元素设置overflow：hidden

动态向父元素后面添加一个clear：bot的块属性元素

7.定位布局

7.1固定定位 position:fixed

7.2相对定位 position:relative

7.3绝对定位 position:absolute

8.表格table

表头：thead

行：tr

列：th

表身：tbody

行：tr

列：td

9.表单标签

form

input->type属性

select->option 下拉选择框

textarea可输入区域

button按钮

10.常用样式

width，height，color，font-size，font-weight，font-family，opacity，rgab,rgb