好程序员web前端培训分享HTML/CSS面试题。准备参加web前端面试的小伙伴们一起来看看吧，希望对大家有所帮助！1、什么是盒子模型？在一个网页中，一个元素所占空间的大小是由几部分组成的，包括元素的内容、元素的padding、元素的border和margin有四部分。在这四个部分所占用的空间中，有的部分可以显示相应的内容，有的部分只是用来分隔相邻的区域或区域。这4部分共同构成了css中元素的盒模型。2.什么是行内元素？什么是块级元素？什么是空元素？行内元素：a、b、span、img、input、strong、select、label、em、button、textarea块级元素：div、ul、li、dl、dt、dd、p、h1-h6、blockquote空元素：没有内容的HTML元素，如：br、meta、hr、link、input、img3、CSS实现垂直和水平居中的经典实现问题的方法有很多种，下面是其中一种实现方式：HTML结构：
CSS:.wrapper{position:relative;}.content{background-color:#6699FF;width:200px;height:200px;position:absolute;//父元素需要相对定位top:50%;left:50%;margin-top:-100px;//高度的二分之一，widthmargin-left:-100px;}4.简述src和href的区别。href指向网络资源的位置，与当前元素（anchor）或当前文档（link）建立链接，用于超链接。src是指向外部资源的位置，指向的内容会嵌入到文档中当前标签的位置；请求src资源时，会下载指向的资源并应用到文档中，比如js脚本、img图片和frame等元素。当浏览器解析到这个元素时，会暂停其他资源的下载和处理，直到该资源被加载、编译和执行。图片、框架等元素也是如此，类似于将指向的资源嵌入到当前标签中。这也是js脚本放在底部而不是放在头部的原因。5.什么是CSSHack？一般来说，就是针对不同的浏览器编写不同的CSS，也就是CSSHack。IE浏览器hack一般分为三种，conditionalhack，attribute-levelhack，selectorhack（详见CSS文档：cssdocument）。例如：//1.ConditionHack//2.AttributeHack.test{color:#0909;/*对于IE8+*/*color:#f00;/*对于IE7和更早版本*/_color:#ff0;/*对于IE6和更早版本*///3.SelectorHack*html.test{color:#090;}/*对于IE6和更早版本*/*+html.test{color:#ff0;}/*对于IE7*/6.简述同步和异步的区别。同步是阻塞模式，异步是非阻塞模式。同步是指进程在执行请求时，如果请求需要一段时间才能返回信息，则进程会等待，直到收到返回信息，然后再继续执行；异步意味着进程不需要一直等待。往下走，而是继续执行后面的操作，不管其他进程的状态如何。当有消息返回时，系统会通知进程进行处理，可以提高执行效率。7.px和em的区别。px和em都是长度单位。不同的是px的值是固定的，你指定多少就多少，计算起来也比较容易。em的值不固定，em会继承父元素的字体大小。浏览器的默认字体高度是16px。所以未经调整的浏览器都符合：1em=16px。那么12px=0.75em，10px=0.625em8，什么叫优雅降级和渐进增强？渐进增强：针对低版本浏览器构建页面，保证最基本的功能，然后针对高级浏览器进行效果和交互的改进和附加功能，以达到更好的用户体验。优雅降级：从一开始就构建完整的功能，然后使其兼容低版本浏览器。区别：A.优雅降级从复杂的现状出发，试图减少用户体验的供给b．渐进式增强从一个非常基本的工作版本开始，然后扩展以满足未来环境的需求c。降级（功能衰减）意味着回头看；而渐进增强意味着向前看，同时确保其根在安全区9.浏览器的核心是什么？IE:tridentkernelFirefox:geckokernelSafari:webkitKernelOpera:以前是prestokernel，Opera现在已经切换到GoogleChrome的BlinkkernelChrome:Blink（基于webkit，由Google和OperaSoftware共同开发）