爱站程序员基地1、对标签语义化的理解？
a. 去掉或者丢失样式的时候能够让页面呈现出清晰的结构
b. 有利于SEO：和搜索引擎建立良好沟通，有助于爬虫抓取更多的有效信息：爬虫依赖于标签来确定上下文和各个关键字的权重；
c. 方便其他设备解析（如屏幕阅读器、盲人阅读器、移动设备）以意义的方式来渲染网页；
d. 便于团队开发和维护，语义化更具可读性，遵循W3C标准的团队都遵循这个标准，可以减少差异化。
2、src与href的区别
src用于替换当前元素；href用于在当前文档和引用资源之间确立联系。
src指向外部资源的位置，指向的内容将会嵌入到文档中当前标签所在位置.
href指向网络资源所在位置，建立和当前元素（锚点）或当前文档（链接）之间的链接.
3、行内元素有哪些？块级元素有哪些，举例说明。
行内：a span img input select
块级：div ul ol li dl dt dd h1
空元素：
行内元素特征：
(1)设置宽高无效
(2)对margin仅设置左右方向有效，上下无效；padding设置上下左右都有效，即会撑大空间
(3)不会自动进行换行
块状元素特征：
(1)能够识别宽高
(2)margin和padding的上下左右均对其有效
(3)可以自动换行
(4)多个块状元素标签写在一起，默认排列方式为从上至下
行内块状元素特征：
(1)不自动换行
(2)能够识别宽高
(3)默认排列方式为从左到右
那head是什么元素？
head是非可视化节点，而块标签，行内标签只是对可视化节点的区分。
4、页面导入样式时，使用link和@import有什么区别？
1、link除了可以加载css之外，还可以加载别的文件(例如.icon图标);
2、link引入css的时候，页面载入时会同时加载，@import需要在页面完全加载以后加载，
而且@import被引用的css会等到引用它的css文件被加载完才会加载
3、link是xhtml标签，没有兼容问题；@import低版本的浏览器不支持
4、link支持使用js去改变样式，而@import低版本的浏览器不支持
5、link方式的样式的权重高于@import的权重
6、@import在html中使用的时候需要包含在
5、position的值有几种，分别是什么，是怎样进行定位的？
static、absolute、relative、fixed、inherit、
sticky:某个元素距离其父元素的距离达到sticky粘性定位的要求时(比如top：100px)；
position:sticky这时的效果相当于fixed定位，固定到适当位置。
6、两栏布局的方法
7、三栏布局的方法
8、圣杯、双飞翼的区别
为了使中间部分的内容完全显示出来圣杯布局采用了左右相对定位，最外层设置内边距的方法
双飞翼布局采用了外层宽度100%，内层使用margin来调整位置
9、浮动会带来什么问题
1、多个浮动的元素无法撑开父元素的宽度，父元素的高度可能会编程0
2、若浮动元素后面跟非浮动元素，非浮动元素会紧随其后浮动起来。
3、若浮动元素前面还有同级元素没有浮动则会影响页面结构。
10、怎样清除浮动
1、在最后一个浮动标签后，新加一个标签，给其设置clear:both
（不推荐）如果清除了浮动，父元素会自动检测子盒子最高的高度，然后与其同高 缺点：添加了无意义标签，语义化差
2、父级添加overflow属性(overflow:hidden) ，通过触发BFC实现清除浮动
（不推荐）内容增多的时候容易造成不会自动换行导致内容被隐藏掉，无法显示要溢出的元素
3、使用after为元素清除浮动
（推荐）
4、使用before和after双为元素清除浮动
11、标准盒子模型和IE盒子模型的差别
标准盒子模型：boxing-size:content-box padding和border不算入宽高
IE盒模型：boxing-size:border-box padding和border算入宽高
12、css权重
!important 无穷
行内样式 1000
id 100
class/属性选择器/伪类：hover 10
标签选择器/伪元素:after 1
通配符 0
13、什么是BFC，怎样触发BFC？
标准流：
1、块级元素独立占据一行，自上而下排列
2、行内元素从左至右排列，直到填满一行才进行换行
非标准流：
浮动，绝对定位会使元素脱离文档流
BFC可以理解为一个区域，在这个区域内的元素无论如何排版布局，都不影响区域外的元素触发BFC的条件：
浮动元素：float除none以外的值
绝对定位元素：position(absolute,fixed)
display为inline-block、table-cells、flex
overflow：除了visble以外的值(hidden,auto,scroll)
