1. 常用那几种浏览器测试？有哪些内核(Layout Engine)?

浏览器：IE，Chrome，FireFox，Safari，Opera。

内核：Trident，Gecko，Presto，Webkit。

2. 说下行内元素和块级元素的区别？行内块元素的兼容性使用？（IE8 以下）

  • 行内元素：会在水平方向排列，不能包含块级元素，设置width无效，height无效(可以设置line-height)，margin上下无效，padding上下无效。
    块级元素：各占据一行，垂直方向排列。从新行开始结束接着一个断行。
  • 兼容性：display:inline-block;*display:inline;*zoom:1;

3.清除浮动有哪些方式？比较好的方式是哪一种？

（1）父级div定义height。

（2）结尾处加空div标签clear:both。

（3）父级div定义伪类:after和zoom。

（4）父级div定义overflow:hidden。

（5）父级div定义overflow:auto。

（6）父级div也浮动，需要定义宽度。

（7）父级div定义display:table。

（8）结尾处加br标签clear:both。

4.box-sizing常用的属性有哪些？分别有什么作用？

box-sizing: content-box|border-box|inherit;

content-box:宽度和高度分别应用到元素的内容框。在宽度和高度之外绘制元素的内边距和边框(元素默认效果)。
border-box:元素指定的任何内边距和边框都将在已设定的宽度和高度内进行绘制。通过从已设定的宽度和高度分别减去边框和内边距才能得到内容的宽度和高度。

5.Doctype作用？标准模式与兼容模式各有什么区别?

<!DOCTYPE>告知浏览器的解析器用什么文档标准解析这个文档。DOCTYPE不存在或格式不正确会导致文档以兼容模式呈现。

标准模式的排版和JS运作模式都是以该浏览器支持的最高标准运行。在兼容模式中，页面以宽松的向后兼容的方式显示,模拟老式浏览器的行为以防止站点无法工作。

6.HTML5 为什么只需要写 <!DOCTYPE
HTML>？

HTML5不基于 SGML，因此不需要对DTD进行引用，但是需要doctype来规范浏览器的行为（让浏览器按照它们应该的方式来运行）。

而HTML4.01基于SGML,所以需要对DTD进行引用，才能告知浏览器文档所使用的文档类型。

7.页面导入样式时，使用link和@import有什么区别？

（1）link属于XHTML标签，除了加载CSS外，还能用于定义RSS, 定义rel连接属性等作用；而@import是CSS提供的，只能用于加载CSS;

（2）页面被加载的时，link会同时被加载，而@import引用的CSS会等到页面被加载完再加载;

（3）import是CSS2.1 提出的，只在IE5以上才能被识别，而link是XHTML标签，无兼容问题;

8.介绍一下你对浏览器内核的理解？

主要分成两部分：渲染引擎(layout engineer或Rendering
Engine)和JS引擎。

渲染引擎：负责取得网页的内容（HTML、XML、图像等等）、整理讯息（例如加入CSS等），以及计算网页的显示方式，后会输出至显示器或打印机。浏览器的内核的不同对于网页的语法解释会有不同，所以渲染的效果也不相同。所有网页浏览器、电子邮件客户端以及其它需要编辑、显示网络内容的应用程序都需要内核。

JS引擎则：解析和执行javascript来实现网页的动态效果。

最开始渲染引擎和JS引擎并没有区分的很明确，后来JS引擎越来越独立，内核就倾向于只指渲染引擎。

9.html5有哪些新特性？如何处理HTML5新标签的浏览器兼容问题？如何区分 HTML 和 HTML5？

HTML5 现在已经不是 SGML 的子集，主要是关于图像，位置，存储，多任务等功能的增加。

  • (1)绘画 canvas;
  • (2)用于媒介回放的 video 和 audio 元素;
  • (3)本地离线存储 localStorage 长期存储数据，浏览器关闭后数据不丢失;
  • (4)sessionStorage 的数据在浏览器关闭后自动删除;
  • (5)语意化更好的内容元素，比如 article、footer、header、nav、section;
  • (6)表单控件，calendar、date、time、email、url、search;
  • (7)新的技术webworker, websocket, Geolocation;

IE8/IE7/IE6支持通过document.createElement方法产生的标签，可以利用这一特性让这些浏览器支持HTML5新标签，浏览器支持新标签后，还需要添加标签默认的样式。当然也可以直接使用成熟的框架、比如html5shim;

<!--[if
lt IE 9]>

<script>
src="http://html5shim.googlecode.com/svn/trunk/html5.js"</script>

<![endif]-->

10.简述一下你对HTML语义化的理解？

    • 用正确的标签做正确的事情。
    • html语义化让页面的内容结构化，结构更清晰，便于对浏览器、搜索引擎解析;
    • 即使在没有样式CSS情况下也以一种文档格式显示，并且是容易阅读的;
    • 搜索引擎的爬虫也依赖于HTML标记来确定上下文和各个关键字的权重，利于SEO;
    • 使阅读源代码的人对网站更容易将网站分块，便于阅读维护理解。

常见的CSS和HTML面试题的更多相关文章

  1. 一线互联网企业常见的14个Java面试题，Java面试题集大全等你拿，颤抖吧程序员！

    本文由尚学堂学员们根据自己参加过的面试回忆.总结而成,一线互联网企业常见的14个Java面试题,包括各大互联网企业.创业小公司,互联网企业.传统软件公司.对于刚毕业和想要跳槽的宝宝们,再适用不过啦,赶 ...

  2. 常见的CSS Hack

    原文地址: 小昱博客 - 常见的CSS Hack 转载请注明出处,谢谢! 什么是CSS hack 由于不同厂商的流览器或某浏览器的不同版本(如IE6-IE11,Firefox/Safari/Opera ...

  3. 39条常见的Linux系统简单面试题

    39条常见的Linux系统简单面试题 本文主要分享39条常见的Linux系统简单面试题,其中包括如何看当前Linux系统有几颗物理CPU和每颗CPU的核数.如何实时查看网卡流量为多少等等,希望对你有所 ...

  4. 常见的CSS样式

    常见的css样式 color 文字颜色 background-color 背景颜色 opacity 设置透明度 颜色: 光的三原色: 红 绿 蓝 三种颜色表示法: 名词表示法: red green b ...

  5. 记录近期面试题，面试总结 (从css - vue 全面面试题)

    记录近期换工作时遇到的面试题和面试题答案 css 部分 盒模型 问题:说一下 css 的盒模型 盒模型分为标准模型和怪异盒模型(IE 盒模型) 标准盒模型:盒模型的宽高只是内容(content)的宽高 ...

  6. css学习（2）-- 常见的CSS属性和值

    1.CSS中修饰字体的属性 属    性 描    述 属  性  值 font-family 字体族科 任意字体族科名称都可以使用例如Times.serif等,而且多个族科的赋值是可以使用的,中间用 ...

  7. 关于IE6的一些常见的CSS BUG处理

    CSS BUG:样式在各浏览器中解析不一致的情况,或者说CSS样式在浏览器中不能正确显示的问题称为CSS BUG: CSS Hack:css hack是指一种兼容css 在不同浏览器中正确显示的技巧方 ...

  8. css页面重构面试题

    偶然间又看到博客园中这两道页面重构面试题.题一:分别用2个DIV,3个DIV,5个DIV实现水平垂直均居中显示一个宽50px,高200px的正十字架.思路:水平垂直均居中的实现,当然非absolute ...

  9. 常见div+css网页布局（float,absolute）

    网页布局-常见 1,           float布局 (1)常规方法 <div id="warp">     <div id="column&quo ...

随机推荐

  1. FOXMAIL提示容量满无法收邮件，清除旧邮件后还是无法收取，请问如何解决？

    FOXMAIL提示容量满无法收邮件,清除旧邮件后还是无法收取,请问如何解决? 2009-03-23 11:21包子燕  分类:网站使用 我清除了FOXMAIL所在的磁盘空间,共有12G,也删除了部分旧 ...

  2. 《C+编程规范 101条规则、准则与最佳实践》笔记

    <C+编程规范 101条规则.准则与最佳实践> 0.不要拘泥于小节(了解哪些东西不应该标准化) * 与组织内现有编码规范一致即可 * 包括但不限于: - 缩进 - 行长度 - 命名规范 - ...

  3. cordova屏幕尺寸

    <platform name="android"> <!-- ldpi : 36x36 px mdpi : 48x48 px hdpi : 72x72 px xh ...

  4. nodejs模块之fs&&stream

    nodejs的文件系统fs模块,可以实现对文件.目录等的操作,stream模块实现对文件数据的断续读写操作 一.文件操作 fs.readFile(file[,options],callback) 异步 ...

  5. 【leetcode刷题笔记】Edit Distance

    Given two words word1 and word2, find the minimum number of steps required to convert word1 to word2 ...

  6. Fidder工具抓包及篡改数据

    下载fiddler的最新版本: 运行fiddler之后测试要调试的页面是否可以捕获,刷新页面后左边列表会实时显示目前http请求的条目.如图红色部分 测试成功,开始断点捕获数据 点击菜单栏按钮[Rul ...

  7. codevs1217 借教室

    借教室(classroom.cpp/c/pas)[问题描述]在大学期间,经常需要租借教室.大到院系举办活动,小到学习小组自习讨论,都需要向学校申请借教室.教室的大小功能不同,借教室人的身份不同,借教室 ...

  8. linux 各个文件系统之间的关系

    linux 系统的各个文件系统是内置于内核中的,用vfs屏蔽了各个文件系统对于文件操作的差异,用户进程是通过系统调用来操作文件系统中的文件的.

  9. BZOJ 3890 [Usaco2015 Jan]Meeting Time：拓扑图dp

    题目链接:http://www.lydsy.com/JudgeOnline/problem.php?id=3890 题意: 给你一个有向图,n个点(n <= 100),m条边. 且所有的边都是从 ...

  10. django 链接地址匹配流程

    前提: 代码结构 步骤一: 下面为某个网页的链接地址 <body> {% if latest_article_list %} <ul> {% for article in la ...