1、关于<!DOCTYPE HTML>

H5只需要<!DOCTYPE HTML>这样简单的声明，不用之前一长串代码，因为H5不是基于SGML，所以不需要对DTD引用，但是需要DOCTYPE规范浏览器的行为

2、行内元素，块级元素，空元素

行内元素：a b span img input select strong

块级元素：div ul ol li dl dt dd h1 h2 p

空元素：<br> <hr> <img> <link> <meta>

3、页面导入样式时，link和@import有什么区别

（1）link是XHTML元素，@import是css自带的

（2）link引入的css是页面加载时同时加载，而@import引入的css是在页面加载完成后才加载的

（3）@import至少需要ie9才完全支持，而link无兼容性问题

（4）link方式的样式权重高于@import的权重

4、H5有哪些新特性，移除了哪些元素？如何解决新标签的浏览器兼容性问题？

新增元素：

（1）内容元素：article footer header nav section

（2）表单控件：date datetime datetime-local month week time email number range search tel url

（3）控件元素：webworker websockt geolocation

移除元素：

（1）显现层元素：basefont big center font s strike tt u

（2）性能较差的元素：frame

5、如何区分 HTML 和 HTML5？
答案解析：
1）在文档类型声明上不同：
HTML是很长的一段代码，很难记住，而HTML5却只有简简单单的声明，方便记忆。
2）在结构语义上不同：
HTML：没有体现结构语义化的标签，通常都是这样来命名的<div id="header"></div>，这样表示网站的头部。
HTML5：在语义上却有很大的优势。提供了一些新的标签，比如：<header><article><footer>

7、HTML5的离线储存怎么使用，工作原理能不能解释一下？
答案解析：
localStorage 长期存储数据，浏览器关闭后数据不丢失；
sessionStorage 数据在浏览器关闭后自动删除。

10、常见兼容性问题？
1）png24位的图片在IE6浏览器上出现背景；
解决方案是：做成PNG8；
2）浏览器默认的 margin 和 padding 不同。
解决方案是：加一个全局的*{margin:0;padding:0;}来统一。
3）IE6双边距bug：块属性标签float后，又有横行的 margin 情况下，在 IE6 显示 margin 比设置的大。浮动IE产生的双倍距离 #box{float:left;width:10px;margin:0 0 0 100px;} 这种情况下IE6会产生200px的距离。
解决方法：加上_display：inline，使浮动忽略
4）IE下，可以使用获取常规属性的方法来获取自定义属性，也可以使用getAttribute()获取自定义属性； Firefox下，只能使用getAttribute()获取自定义属性。
解决方法：统一通过getAttribute()获取自定义属性。
5）IE下，even对象有x，y属性，但是没有pageX，pageY属性，但是没有x，y属性；
解决方法：（条件注释）缺点是在IE浏览器下可能会增加额外的HTTP请求数。
6）Chrome中文界面下默认会将小于 12px 的文本强制按照 12px 显示
解决方法：可通过加入 CSS 属性 -webkt-text-size-adjust:none;解决
7）超链接访问过后 hover 样式就不出现了，被点击访问过的超链接样式不在具有 hover 和 active ；
解决方法：改变CSS属性的排列顺序：L-V-H-A: a:link{ }  a:visited{ } a:hover{ } a:active{ }

11、如何实现浏览器内多个标签页之间的通信？
答案解析：
调用localstorge、cookies等本地存储方式

12、webSocket如何兼容低浏览器？
答案解析：
Adobe Flash Socket 、 ActiveX HTMLFile (IE) 、 基于 multipart 编码发送 XHR 、 基于长轮询的 XHR

13、支持HTML5新标签
答案解析：
1）IE8/IE7/IE6支持通过 document.createElement 方法产生的标签，可以利用这一特性让这些浏览器支持 HTML5 新标签，浏览器支持新标签后，还需要添加标签默认的样式；
2）当然最好的方式是直接使用成熟的框架、使用最多的是 html5shim 框架
<!--[if lt IE 9]> 
<script> src="http://html5shim.googlecode.com/svn/trunk/html5.js"</script> 
<![endif]-->

22、如何居中div？ 如何居中一个浮动元素？
答案解析：
给div 设置一个宽度，然后添加 margin:0 auto 属性；div{width:200px; margin:0 auto; }

23、居中一个浮动元素
答案解析：
确定容器的宽高  宽500 高300的层，设置层的外边距
.div{width:500px;height:300px;margin:-150px 0 0 -250px;position:relative;background:green；left：50%；头：50%}

25、为什么要初始化 CSS 样式
答案解析：
因为浏览器的兼容问题，不同浏览器对有些标签的默认值是不同的，如果没对 CSS 初始化往往会出现浏览器之间的页面显示差异。
当然，初始化样式会对 SEO 有一定的影响，但鱼和熊掌不可兼得，但力求影响最小的情况下初始化。
最简单的初始化方法是：*{padding:0;margin:0} (不建议)
淘宝的样式初始化：
body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, form, fieldset, legend, button, input, 
        textarea, th, td { margin:0; padding:0; } 
        body, button, input, select, textarea { font:12px/1.5tahoma, arial, \5b8b\4f53; } 
        h1, h2, h3, h4, h5, h6{ font-size:100%; } 
        address, cite, dfn, em, var { font-style:normal; } 
        code, kbd, pre, samp { font-family:couriernew, courier, monospace; } 
        small{ font-size:12px; } 
        ul, ol { list-style:none; } 
        a { text-decoration:none; } 
        a:hover { text-decoration:underline; } 
        sup { vertical-align:text-top; } 
        sub{ vertical-align:text-bottom; } 
        legend { color:#000; } 
        fieldset, img { border:0; } 
        button, input, select, textarea { font-size:100%; } table { border-collapse:collapse; border-spacing:0; }

29、CSS实现垂直水平居中

答案解析：

一道经典的问题，实现方法有很多种，以下是其中一种实现：

HTML结构：

<div class="wrapper">

<div class="content"></div>

</div>

CSS：

.wrapper{position:relative;}

.content{

background-color:#6699FF;

width:200px;

height:200px;

position: absolute;        //父元素需要相对定位

top: 50%;

left: 50%;

margin-top:-100px ;   //二分之一的height，width

margin-left: -100px;

}

HTML5小知识汇总的更多相关文章

  1. C语言中重要的小知识汇总

    用于整理记录一些C语言下的小知识点: 1. 在C语言中,怎么查看一个数据类型占用了多少个字节大小呢? 可以使用sizeof(int)/sizeof(double)等来查看某数据类型到底用了几个字节: ...

  2. HTML5小知识

    1.HTML5一种“妥协的”语法 2.特点: 标签不区分大小写 元素可以省略结束标签 元素属性可以省略属性值 属性的属性值可以不适用引号

  3. HTML5基础知识汇总（一）

    一.HTML的开发工具和使用的浏览器 开发工具:记事本等文本编辑器,Atom.VisualStudioCode( VSCode).Brackets.Sublime text和Hbuider. 浏览器: ...

  4. Python基础1：一些小知识汇总

    一.#!usr/bin/env python 脚本语言的第一行,指定执行脚本的解释器. #!/usr/bin/python 是告诉操作系统执行这个脚本的时候,调用/usr/bin下的python解释器 ...

  5. 常用JS小知识汇总

    1 上传图片:html代码 <input id="image" type='file' name='myFile' size='15' onchange="show ...

  6. Android小知识汇总

    1.Android Studio 将module编译打包成aar文件,module依赖的 (例如 compile 'com.zhy:autolayout:1.4.3' )不会被打包进入aar文件,应用 ...

  7. HTML5基础知识汇总_(2)自己定义属性及表单新特性

    自己定义属性data-* 说起这个属性,事实上如今非经常见了;怎么说呢,由于在一些框架都能看到他的身影!!! 比方Jquery mobile,里面非常频繁的使用了这个属性; 这个属性是哪里来的-.当然 ...

  8. Eclipse常用小知识汇总

    原文:http://blog.csdn.net/jinzhencs/article/details/50462370 1.修改注释 自动出来的author

  9. javascript常用知识汇总

    javascript这个语言庞大而复杂,我用了三年多了,还是皮毛都不会.从刚开始的jquery,到后来的es6,每天都在学习,每天都在忘记. 1.禁止手机虚拟键盘弹出 在开发适配手机的页面时,出现了这 ...

随机推荐

  1. fstream文件打开模式

    fstream:对于文件的操作很久两年前就开始使用了,但是仅仅为了达到满足自己需求的目的,就是要么是写,要么是读.从来没有对其进行详细的了解.自己也曾经想过花一点时间去总结一下,这个东西到底应该怎么用 ...

  2. leetcode 49 Group Anagram

    lc49 Group Anagram 逻辑很简单,就是统计字母出现次数,然后将完全相同的字符串放入同一list 关键是怎么实现 统计的部分,可以通过将string排序,Arrays.sort(),或者 ...

  3. SSH协议的Python实现paramiko

    目录 paramiko安装 SSHClient类与SFTPClient类 SSHClient类的方法 SFTPClient类的方法 paramiko的基本使用 paramiko.SSHClient两种 ...

  4. day48作业

    使用Bootstrap框架编写一个简单的web静态页面 效果图: <!DOCTYPE html> <html lang="en"> <head> ...

  5. Python导出DBF文件到Excel的方法

    Python导出DBF文件到Excel的方法 这篇文章主要介绍了Python导出DBF文件到Excel的方法,实例分析了Python基于win32com模块实现文件导出与转换的相关技巧,分享给大家供大 ...

  6. 关于JVM调优

    JVM调优主要是针对内存管理方面的调优,包括控制各个代的大小,GC策略.由于GC开始垃圾回收时会挂起应用线程,严重影响了性能,调优的目是为了尽量降低GC所导致的应用线程暂停时间. 减少Full GC次 ...

  7. hdu3853之概率dp入门

    版权声明:本文为博主原创文章,未经博主同意不得转载. https://blog.csdn.net/xingyeyongheng/article/details/25205693 LOOPS Time ...

  8. 通过java反射实现的excel数据导出

    Excel.java @SuppressWarnings("deprecation") public static <T> void ExportExcel(Strin ...

  9. Linq处理list数据

    获取数据列表. //获取数据列表,Model是类 IList<Model> list = dao.getmx(Model, pageInfo);//DataTable数据DataTable ...

  10. java普通for循环和for-each迭代循环的区别

    PO实体类User: package aA; public class User { private String name; private int many; private int id; pu ...