前端面试题总结-HTML（持续更新中）

前端面试题总结-HTML（持续更新中）1、什么是HTML？HTML:HyperTextMarkupLanguage超文本标记语言2.XHTML和HTML有什么区别HTML是一种基本的WEB页面设计语言，XHTML是一种基于XML的标记语言3.简述您对HTML语义的理解？HTML语义使页面内容条理清晰，便于浏览器和搜索引擎分析；4、浏览器页面的三层是什么，分别是什么，作用是什么？浏览器页面组成：结构层、表现层和行为层分别是：HTML、CSS、JavaScript功能：HTML实现页面结构，CSS实现页面的表现和样式，JavaScript实现客户端的一些功能和服务。5、Doctype的作用是什么？严格模式和混杂模式有什么区别？(1)功能：用于告诉浏览器的解析器使用什么文档标准来解析这个文档。(2)区分：如果一个HTML文档包含了完整的DOCTYPE，一般以标准模式呈现。不存在或格式不正确的DOCTYPE将导致文档以混杂模式呈现。6.怪癖模式是什么？它和Standards模式有什么区别：整体布局、样式解析和脚本执行三个方面的区别。盒模型：在W3C标准中，如果给元素设置宽高，是指元素内容的宽高。在Quirks模式下，IE的宽高还包括padding和border。设置内联元素的高宽：在Standards模式下，为等内联元素设置wdith和height不会生效，但在quirks模式下会生效。Sethorizo??ntalcenteringwithmargin:0auto：在标准模式下使用margin:0auto使元素水平居中，但在quirks模式下会失败。7、页面导入样式时，使用link和@import有什么区别？(1)作用不同：link是一个XHTML标签，除了加载CSS外，还可以用来定义RSS，定义rel连接属性等；而@import是CSS提供的，只能用来加载CSS；(2)加载不同：页面加载时会同时加载链接，@import引用的css会等到页面加载完成后才加载；(3)兼容性不同：import是CSS2.1提出的，只能被IE5及以上识别。链接是XHTML标签，不存在兼容性问题；8.你知道哪些图像格式会用于制作网页？Webp：WebP格式，Google开发的一种图像格式，用于加快图像加载速度。并且可以节省大量的服务器带宽资源和数据空间。FacebookEbay等知名网站已经开始测试使用WebP格式。Apng：是PNG的位图动画扩展，可以实现png格式的动态图片效果，有望取代GIF成为下一代动态图??片标准。9.文字标记1.特殊字符1.表示空格2.<表示<3.>表示>4.?表示版权5.￥￥2.文字样式1.:粗体2.：斜体3.：下划线4.：删除线5.：上标6.:下标10.什么是锚点锚点是网页中的一个标记，可以通过超链接跳转到该标记位置。1.定义锚点1.使用a标签的name属性定义锚点2.使用any标签的id属性定义锚点2.链接到锚点本页其他页11.div+CSS布局有什么优势？(1)修改版本更方便，改css文件即可。(2)页面加载速度更快，结构清晰，页面展示简洁。表示与结构分离。(3)易于优化(seo)搜索引擎更友好，排名更容易出人头地。12.什么是行内元素？什么是块级元素？什么是空（void）元素？首先：CSS规范规定每个元素都有一个display属性来判断元素的类型，每个元素都有一个默认的display值。例如，div默认显示值为“block”，即“块级”元素；span默认显示属性值为“inline”，即“内联”元素。(1)行内元素包括：abspanimginputselect(2)块级元素包括：divpulollidldtddh1-h6(3)常见空元素：br-换行符，hr-水平分割线；13.iframe的缺点是什么？1、iframe会阻塞主页面的Onload事件，影响页面的并行加载；2、搜索引擎的检索程序无法解读此类页面，不利于SEO；改进：通过javascript给iframe动态添加src属性值，这样就可以绕过上面两个问题。14.Label的作用是什么？它是如何使用的？label标签定义了表单控件之间的关系。当用户选择标签时，浏览器会自动将焦点放在与标签相关的表单控件上。15、隐藏元素的几种方法（1）display：none；(2)可见性：隐藏；(3)不透明度：0；(4)位置：绝对；左：-10000px；16.简述src和href的区别。src用于替换当前元素，href用于在当前文档和引用资源之间建立链接。17.画一条高度为1px的线，不使用边框，在不同浏览器的标准模式和怪异模式下可以保持一致的效果18。如何给背景图片添加超链接