1、你做的页面在哪些流览器测试过?这些浏览器的内核分别是什么?
答：我在IE（trident） 欧朋（blink） 谷歌（blink） 火狐(gecko) safari(webkit)
2、每个 HTML 文件里开头都有个很重要的东西，Doctype，知道这是干什么的吗?
答：版本声明 声明H5 不声明也许会发生错误和混杂模式
4、div+css 的布局较 table 布局有什么优点？
有益于维护，div和css布局灵活 页面加载更快 表现和结构分离 易于引擎更友好排名靠前
6、你能描述一下渐进增强和优雅降级之间的不同吗?
答：渐进增强是从低版本到高版本 优雅降级是从高版本到低版本
10、简述一下 src 与 href 的区别。
答：scr是下载 href是引入
11、知道的网页制作会用到的图片格式有哪些？
答： jpg，png，gif png-8 png-24 svg webp
14、一个页面上有大量的图片（大型电商网站），加载很慢，你有哪些方法优化这些图 片的加载，给用户更好的体验。
答：图片懒加载，在页面上的未可视区域可以添加一个滚动条事件，判断图片位置与浏览器顶端 的距离与页面的距离，如果前者小于后者，优先加载。
如果为幻灯片、相册等，可以使用图片预加载技术，将当前展示图片的前一张和后一张优先 下载。
如果图片为 css 图片，可以使用 CSSsprite，SVGsprite，Iconfont、Base64 等技术。
如果图片过大，可以使用特殊编码的图片，加载时会先加载一张压缩的特别厉害的缩略图， 以提高用户体验。
如果图片展示区域小于图片的真实大小，则因在服务器端根据业务需要先行进行图片压缩， 图片压缩后大小与展示一致。
17、有哪项方式可以对一个 DOM 设置它的 CSS 样式？
答：外链 内联 行内
18、CSS 都有哪些选择器？
答：id选择器，类名选择器，派生，后代选择器，群组选择器
19、CSS 中可以通过哪些属性定义，使得一个 DOM 元素不显示在浏览器可视范围内？
答：display：none visibility 高度和宽都是0 不设置颜色
20、超链接访问过后 hover 样式就不出现的问题是什么？如何解决？
答：超链接点击后就不会再具有hover和active属性了
LOVE设置
21、什么是 Css Hack？ie6,7,8 的 hack 分别是什么？
答：针对不同浏览器设置不同的cssHack的过程就是Css Hack
IE 6 + IE 7 _
24、行内元素和块级元素的具体区别是什么？行内元素的padding和margin可设置吗？
答：行内元素不换行每个元素会在一行不可以设置左右margin
块级元素独占一行，
input img texterea label botton
25、什么是外边距重叠？重叠的结果是什么？
答：两个兄弟元素同时设置外边距，取最大值
外边距重叠就是 margin-collapse
26、rgba()和 opacity 的透明效果有什么不同？
答：都能实现透明效果，opacity主要作用于元素，和所有内容的透明
而rgba主要用于元素的颜色和背景
27、css 中可以让文字在垂直和水平方向上重叠的两个属性是什么？
答：lin-height 水平方向：letter-spacing
那么问题来了，关于 letter-spacing 的妙用知道有哪些么? 答案:可以用于消除 inline-block 元素间的换行符空格间隙问题。
28、如何垂直居中一个浮动元素？
答：方法已知元素宽高 绝对定位 宽高50%
未知宽高 绝对定位 上下左右都为0
29、px 和 em 的区别。
答：都是设置长度单位，但区别是px是固定的 指定是多少就是多少，em的值不固定并且会继承父级的字号大小
32、display:none 与 visibility:hidden 的区别是什么？
答：display:none设置元素隐藏不占位置。不能被继承
visibility:hidden元素隐藏的时候占用位置，会被继承
35、简介盒子模型
答：在html中每一个元素都被看作一个盒子拥有盒子的外形特点
盒子模型分为标准盒模型和怪异盒模型
36、为什么要初始化样式？
答：浏览器兼容问题，不同的浏览器对标签的默认不同，若是不同会造成不同差异
37、BFC 是什么?
答：BFC格式化上下文 开启一个独立的空间，里面的布局不会影响外面的布局，在同一个BFC里面相邻的两个盒子在垂直方向发生重叠问题
39、Doctype 的作用？严格模式与混杂模式的区别？
答：声明版本 严格模式下：页面排版和JS解析是以该浏览器支持最高版本来执行的
混杂模式：一般是用来兼容旧的浏览器，向后兼容
43、对 WEB 标准以及 W3C 的理解与认识
答：标签闭合、标签小写、不乱嵌套、提高搜索机器人搜索几率、使用外 链 css 和 js 脚本、 结构行为表现的分离、文件下载与页面速度更快、内容能被更多的用户所访问、内容能被更 广泛的设备所访问、更少的代码和组件，容易维 护、改版方便，不需要变动页面内容、提 供打印版本而不需要复制内容、提高网站易用性。
44、行内元素有哪些?块级元素有哪些?CSS 的盒模型?
答：行内：span img input select 块级：div ul p h
盒模型：内容，padding margin
45、前端页面有哪三层构成，分别是什么?作用是什么
答：结构成 表现成 行为层
47、行内元素有哪些？块级元素有哪些？ 空(void)元素有那些？
答：行内元素：img input form select a b span strong 块级元素：ul
div li dl dd dt p h
空元素：br hr img input link 鲜为人知的是: <area><base><col><command> <embed><keygen><param><source><track><wbr>
52、列出 display 的值，说明他们的作用。position 的值，
答：display:block 将元素转为块级元素
display:none 将元素隐藏
display:inline-block 行内
display：list-item
position：absolute fixed relative static
53、absolute 的 containing block 计算方式跟正常流有什么不同？
答： 若此元素为 inline 元素，则 containing block 为能够包含这个元素生成的第一个和最后一个 inline box 的 padding box (除 margin, border 外的区域) 的最小矩形；
否则则由这个祖先元素的 padding box 构成。
根元素所在的 containing block 被称为 initial containing block，在我们常用的浏览器环境下，指的是原点与 canvas 重合，大小和 viewport 相同的矩形；
对于 position 为 static 或 relative 的元素，其 containing block 为祖先元素中最近的 block container box 的 content box (除 margin, border, padding 外的区域)；
对于 position:fixed 的元素，其 containing block 由 viewport 建立；
对于 position:absolute 的元素，则是先找到其祖先元素中最近的 position 属性非 static 的元素，然后判断：
如果都找不到，则为 initial containing block。
网友评论