浙江大华前端面试题

1、行内标签和块组标签有哪些

块组标签：<div>、<p>、<h1>...<h6>、<ol>、<ul>、<dl>、<table>、<address>、<blockquote> 、<form>

行内标签：a、span、em、strong、b、i、u、label、br、img；

块级元素和内联元素的区别

1. 块级元素会独占一行，其宽度自动填满其父元素宽度

行内元素不会独占一行，相邻的行内元素会排列到同一行里，直到一行排不下，才会换行，其宽度随元素的内容变化而变化，

2. 一般情况下，块级元素可以设置width,height属性，行内元素设置width,height无效

（注意，块级元素设置了width宽度属性后仍然是独占一行的）

3. 块级元素可以设置margin,padding属性

行内元素的水平方向的padding-left和padding-right都会产生边距效果，但是竖直方向上的padding-top和padding-bottom都不会产生边距效果

2、div和span的区别

（一)span和div功能区别

span和div区别在于，div是一个块级元素，它包含的元素会自动换行。

而span是行内元素，在它的前后不会换行。span没有结构上的意义，只是单纯的应用样式，其他元素不适合时，就可以使用span元素。

span可以作为div的子元素，但div不能是span的子元素，如果出现span中出现div不符合ws3c的页面标准。

（二）span和div使用区别

span元素宽度是被包围的内容宽度决定，不建议给span设置宽度属性width，可以给span设置margin值，设置与父元素之前的距离。

span可以通过css声明（display:block）转换为块元素，想对一行中的文字或图片单独设置样式，而又由不需要换行的条件下又不影响其他行内其他内容，span可以很好解决这些问题

3、写出ul、ol、dl的区别

1.ul是无序列表，也就是说没有排列限制可以随意加li；

2.ol有序列表，会按照你写的li前后依次排列；

3.dl是定义列表，会默认前后层级关系；

<dl> <dt>我是头</dt>

<dd>我是内容</dd>

<dd>我是内容</dd>

</dl>

我是头

--我是内容

--我是内容

4、如何理解标签语义化、它有哪些好处

标签语义化：简单来说，就是让标签有含义，给某块内容用上一个最恰当最合适的标签，使页面有良好的结构，页面元素有含义，不论是谁都能够看懂这块内容是什么，并且有利于搜索引擎。

好处：

1. HTML结构清晰

2. 代码可读性较好

3. 无障碍阅读

4. 搜索引擎可以根据标签的语言确定上下文和权重问题

5. 移动设备能够更完美的展现网页（对css支持较弱的设备） 6. 便于团队维护和开发

5、css的选择符有哪些，优先级如何计算，哪些属性可以继承

选择符：

1.id选择器（#id）

2.类选择器（.class）

3.标签选择器（div，h1，p）

4.相邻选择器（h1 + p）

5.子选择器（ul > li）<