web前端面试之HTML不常用问题（码动未来）
1.1.1、解释下CSS sprites，以及你要如何在页面或网站中使用它。
CSS Sprites其实就是把网页中一些背景图片整合到一张图片文件中，再利用CSS的“background-image”，“background-repeat”，“background-position”的组合进行背景定位，background-position可以用数字能精确的定位出背景图片的位置。
1.4.2、你熟悉SVG样式的书写吗？
SVG指可伸缩矢量图形 (Scalable Vector Graphics)
SVG用来定义用于网络的基于矢量的图形
SVG使用 XML 格式定义图形
SVG图像在放大或改变尺寸的情况下其图形质量不会有所损失
SVG是万维网联盟的标准
SVG与诸如 DOM 和 XSL 之类的 W3C 标准是一个整体
1.4.3、页面可见性（Page Visibility API） 可以有哪些用途？
通过visibilityState的值检测页面当前是否可见，以及打开网页的时间等;在页面被切换到其他后台进程的时候，自动暂停音乐或视频的播放；
1.4.4、如何在页面上实现一个圆形的可点击区域？
1、map+area或者svg
2、border-radius
3、纯js实现 需要求一个点在不在圆上简单算法、获取鼠标坐标等等
1.4.5、实现不使用border画出1px高的线，在不同浏览器的标准模式与怪异模式下都能保持一致的效果。
<div style="height:1px;overflow:hidden;background:red"></div>
1.4.6、网页验证码是干嘛的，是为了解决什么安全问题。
区分用户是计算机还是人的公共全自动程序。可以防止恶意破解密码、刷票、论坛灌水；有效防止黑客对某一个特定注册用户用特定程序暴力破解方式进行不断的登陆尝试。
1.4.7、如何优化网页的打印样式？
<link rel = "stylesheet" type = "text/css" media = "screen" href = "xxx.css"/>
其中media指定的属性就是设备，显示器上就是screen，打印机则是print，电视是tv，投影仪是projection。
但打印样式表也应注意以下事项：
打印样式表中最好不要用背景图片，因为打印机不能打印CSS中的背景。如要显示图片，请使用html插入到页面中。
最好不要使用像素作为单位，因为打印样式表要打印出来的会是实物，所以建议使用pt和cm。
隐藏掉不必要的内容。（@print div{display:none;}）
打印样式表中最好少用浮动属性，因为它们会消失。如果想要知道打印样式表的效果如何，直接在浏览器上选择打印预览就可以了。
1.4.8、你做的页面在哪些流览器测试过?这些浏览器的内核分别是什么
Ie(Ie内核) 火狐（Gecko） 谷歌（webkit,Blink） opera(Presto),Safari(wbkit)
1.4.9、什么是语义化的HTML?
直观的认识标签对于搜索引擎的抓取有好处，用正确的标签做正确的事情！html语义化就是让页面的内容结构化，便于对浏览器、搜索引擎解析；在没有样式CCS情况下也以一种文档格式显示，并且是容易阅读的。搜索引擎的爬虫依赖于标记来确定上下文和各个关键字的权重，利于 SEO。使阅读源代码的人对网站更容易将网站分块，便于阅读维护理解。
1.4.10、HTML5 为什么只需要写 !DOCTYPE HTML？
HTML5不基于 SGML，因此不需要对DTD进行引用，但是需要doctype来规范浏览器的行为（让浏览器按照它们应该的方式来运行）；而HTML4.01基于SGML,所以需要对DTD进行引用，才能告知浏览器文档所使用的文档类型。
1.4.11、Doctype作用？标准模式与兼容模式各有什么区别?
!DOCTYPE声明位于位于HTML文档中的第一行，处于html 标签之前。告知浏览器的解析器用什么文档标准解析这个文档。DOCTYPE不存在或格式不正确会导致文档以兼容模式呈现。
标准模式的排版和JS运作模式都是以该浏览器支持的最高标准运行。在兼容模式中，页面以宽松的向后兼容的方式显示,模拟老式浏览器的行为以防止站点无法工作。
QQ技术交流群:815302226
网友评论