小知识，大挑战！本文正在参与“程序员必备小知识”创作活动。
大家好，我是不孤独的百年，周末时间持续整理一些普通的小知识点，加深记忆，积少成多嘛~~
浏览器兼容写法
- 火狐以及使用Mozilla浏览器引擎的浏览器：
-moz- - Safari 谷歌浏览器以及使用Webkit引擎的浏览器：
-webkit- - Opera浏览器：
-o- - Internet Explorer：
-ms-
移动端适配问题
-
px + viewport适配
-
rem布局
-
媒体查询
-
vw布局
a标签点击hover事件失效问题
在写的时候把a标签的这些属性写好顺序就可以 link > visited > hover > active >
旋转屏幕，字体大小调整问题
html,body {
-webkit-text-size-adjust:100%;
}
长时间按住页面的闪退问题
element {
-webkit-touch-callout:none;
}
SEO问题
SEO：搜索引擎优化，可以利用搜索引擎的规则提高网站在有关搜索引擎内的自然排名。方法举例：
-
合理的
title，description，keywords：三个权重逐个减小，title重点词不要超过两个，description概括页面内容，keywords列出重要的关键词。 -
语义化html代码，符合w3c规范
-
重点内容不要用JS输出，爬虫获取不到JS内容
-
少使用iframe，搜索引擎不会抓取iframe的内容
-
不是装饰性的图片加上alt
-
提高网站速度
link和@import的区别
-
link是HTML的方式，@import是css方式
-
link最大限度的支持并行下载，@import多嵌套导致串行下载，会出现文档样式短暂失效
-
浏览器对link的支持早于@import，可以使用@import对老的浏览器隐藏样式
-
@import必须在样式规则之前，可以再css文件中引用其他文件
BFC含义
BFC，也叫块级格式化上下文，它是页面中的一块渲染区域，并且有一套渲染规则，它决定了其子元素将如何定位,以及和其他元素的关系和相互作用。
具有BFC特性的元素可以看作是隔离了的独立容器，容器里面的元素不会在布局上影响到外面的元素。
通俗―点来讲，可以把BEc理解为一个封闭的大箱子，箱子内部的元素无论如何翻江倒海，都不会影响到外部。
此外，BFC具有普通容器所没有的一些特件。语如:同一个BFC下外边距会发生折叠、BFC可以包含浮动的元素（清除浮动)、BFC可以阻止 元素被浮动元素覆盖。
只要元素满足下面任一条件即可触发BFC特性:
- body根元素
- 浮动元素:float除none 以外的值
- 绝对定位元素:position (absolute、fixed)。 display 为inline-b1ock、table-cel1s、flexo overflow除了visible以外的值 (hidden、auto.scro11)
