前端面试准备之——HTML篇

1.对Web标准的理解和W3C的认识。

Web标准简单的将页面分为结构(HTML),样式(CSS),和行为(JavaScript),Web标准将其独立分开使其更具有模块化。

W3C对Web标准提出了规范化的要求,比如

① 对结构的要求:标签字母要小写,标签要闭合,标签不随意嵌套,这样有助于页面被搜索引擎的抓取,对SEO有很大的帮助。

② 对样式和行为的要求:要求尽量使用外链的样式表和脚本,做到页面的模块化,使用更少的代码和组件,这样使页面容易维护,改版方便,不需要变动页面内容

2. Doctype的作用?严格模式和混杂模式的区别? 以及如何触发?

Doctype存在HTML页面代码的第一行(标签之前),用于告诉浏览器用什么样的Web标准来解析该页面。

严格模式是根据浏览器所支持的最高的标准来解析文档。混杂模式(兼容模式)页面会以宽松的向后兼容的模式被解析,会模拟老浏览器的的行为以防止站点无法工作。

页面如果包含完整的DOCTYPE 页面就是以严格模式来解析页面, 如果不写或者Doctype的格式错误会导致浏览器以兼容模式解析该页面。

3. 为什么HTML5只用书写 ?

因为HTML5不是基于SGML,因此不需要对DTD进行引用,但是要用DOCTYPE来规范浏览器的行为

而HTML4.0是基于SGML, 因此需要对DTD的引用,才能让浏览器知道该文档所使用的文档类型。

4. 描述从输入网址到显示网页的过程

1、浏览器输入网址

2、DNS服务器解析相应的域名:一般是本机的DNS服务器先解析,如果没有就请求上级DNS服务器中解析,直到得到相应的Web服务器的IP地址

3、浏览器与服务器建立TCP连接(两次握手)

4、浏览器向服务器发送HTTP请求

5、服务器响应浏览器的请求,查找资源并返回响应报文(包括状态码200,300,400,500等)

6、服务器返回相应的HTML源文件

7、服务器与客户端断开TCP连接(4次挥手)

8、浏览器得到相应的资源开始进行解析,构建DOM树,渲染DOM树,绑定事件的等页面显示完成。

5. HTTP1.1和HTTP2的区别

1、HTTP 2.0 采用二进制格式并非文本格式

2、HTTP 2.0 是完全多路复用

3、使用报头压缩,降低了HTTP/2的开销

4、HTTP/2 可以让服务器的响应主动推送到客户端缓存中

6. HTML和XHTML的区别?

HTML是web网页设计语言,XHTML是基于XML的置标语言

XHTML元素必须被正确嵌套,正确关闭,标签必须小写,必须有根元素。

7. 盒子模型

分为IE盒子模型和标准盒子模型 (content  border padding margin)

IE盒子模型包括conent、border 和 padding

标准盒子模型包括content

8. 行内元素有哪些? 块级元素有哪些?

行内元素: span img input textarea a input 

块级元素: div h1~h6  ul ol p table dir

9. 对浏览器内核的理解?以及常见的浏览器内核有哪些?

浏览器内核负责对网页语法的解释和渲染显示,不同浏览器对网页语法的解释和渲染有所不同,因此在编写页面时要在不同内核的浏览器中测试才行。

常见的浏览器内核有

IE浏览器的 Trident

Opera Chrome 使用webkit内核

IE Edge浏览器使用 EdgeHtml内核

10. CSS引入方法有哪些? link 和 @import 有什么区别?

页面内使用css的方式有: 行内嵌入式  页面头部内嵌套 外面链接调用

外部链接有两种方式:link 和 @import

两者的区别:link是XHTML的标签,不仅可以引入CSS外,还可以定义RSS服务

@import是属于CSS范畴,只能引入CSS文件

link引入的文件在页面的加载同时加载,而@import的CSS必须在页面加载完后才能加载

link引入的样式支持JS的DOM操作更改样式(即通过更改link的src属性,来达到更换css样式表),而@import引入的样式不可以更改。

11. 简述你对HTML语义化的理解

1、HTML语义化可以让页面的内容结构化,结构清晰,有利于浏览器和搜索引擎的解析

2、在没有CSS样式的情况下,以文档的形式展示出来,并且是便于理解的

3、有利于阅读源码人员的理解,方便以后的维护,更新。

4、搜索引擎的爬虫也依赖于HTML标记来确定上下文和各个关键字的权重,有利于SEO;

12、form表单的readonly 和 disabled属性的区别?

readonly是用户只能看,不能更改,但是会随表单提交

disabled是input元素在加载时禁用,不会随着表单提交

但二者都可以通过js脚本更改value值。

13、标签中唯一必须的标签是?

下面这些标签可用在 head 部分::

你可能感兴趣的:(前端面试准备之——HTML篇)