CSS--问题解决思路

1. 解决问题的正确做法：
   排除问题，审查元素看看，在浏览器修改css属性排查问题
   检查宽高，浮动是否有影响，属性值是否正确
   设置元素边框或者背景色来调试看看
   单独写一个html文件，测试这个问题的存在，一定要搞明白为什么
   注：出现问题，怎么解决的这个问题一定不要忘了记录到文档里，先描述问题，解决之后描述怎样实现的，一定要养成记录总结的习惯

2. 不知道怎么布局怎么办？
   先把笔把结构画出来，上下左右分别应该用什么标签
   凡是左右区域内容，都分别用div包裹起来，使用浮动
   凡是列表或者选项卡优先考虑使用ul li 标签实现
   凡是大的一块文本都用div或者p包裹起来
   表示一块内容，用个div包裹起来
   居中布局，div设置固定宽度（然后使用margin：0 auto）
   文字居中
   首先考虑使用text-align：center
   考虑使用span包裹起来设定宽度然后margin：0 auto；
   为什么用span包裹起来，span是行内元素，包含一行
   前提：定义display：block
   最后考虑使用绝对定位（子绝父相）
   文字居右
   优先考虑使用绝对定位
   在考虑使用浮动（使用浮动一定 要记得清除浮动）
   文字压住一根线
   一般显示的文字是一个div包裹起来，然后给div设置一个，使用定位来实现压住线

3. 不知道怎样设置属性？
   横着排的列表，一般是将li设置为浮动
   横着排的板块内容，一般是将div设置为浮动
   鼠标移上去显示一块内容，考虑使用伪类：hover
   凡是字体相关的，使用字体系类属性来控制
   行高考虑使用line-height
   间距
   优先考虑使用padding，但是使用padding一定注意盒子
   有边框的元素之间，使用margin
   设置边框一定是使用boder系列的属性
   行内元素设置高度，以及使用padding-top（bottom）需转换成块级元素display：block/inline-block

4. CSS先写哪里，再写哪里？
   先把布局调好，让格式看起来不那么的乱
   设置图片的宽高，设置元素的宽高
   然后调间距
   设置文字元素的对齐方式
   最后调字体
   调试hover显示内容的时候，先把元素显示出来调试，然后再去加效果
   在调试的时候可以加个边框，方便看div的宽高和里面的内容

5. 语义标签理解，用过哪些标签，哪些标签不推荐？
   语义：使用具体名字来定义标签，看起来更直观，方便搜索引擎搜索
   用过标签：新结构化标签：header article footer address code
   不推荐标签：font frameset
   块级元素和行内元素有哪些？
   块级元素：div ul li p
   行内元素：span a img
   转换：display：block inline-block
   css引入的位置？为什么要初始化css？
   一般是在header标签里引入，css是在body里面引入
   浏览器加载html文档从上往下依次加载，如果所有标签加载完了再去加载css，浏览器要再次重新渲染css，可能会造成页面闪一下的情况

6. link和@import的区别
   两者都是外部引用css的方式，但是存在一定的区别：
   区别1：link是XHTML标签，除了加载css外，还可以定义RSS等其他事务，@importrant属于CSS范畴
   区别2：link引用CSS时，在页面载入时同时加载，@important需要页面完全载入以后加载
   区别3：link是XHTML标签，无兼容问题，@important是在CSS2.1提出的，低版本的浏览器不支持
   区别4：link支持使用javascript 控制DOM去改变样式，而@important不支持

7. css选择器有哪些？哪些属性可以继承？优先级算法如何计算？内联和important哪个优先级高？
   标签选择器 类选择器 id选择器 继承不如指定
   ！import》行内样式》id》class》标签选择器

8. 前端页面有哪三层构成，分别是什么？作用？
   结构 html 表现 css 行为js

9. 三种伪类？
   A:hover 鼠标移上去的样式
   A:link 默认的链接样式
   A:visited 访问过得样式

10. Css中position属性的值有哪些及其含义？
    Absolute 生成绝对定位的元素，相对于static定位以外的第一个父元素进行定位
    Fixed 生成相对定位的元素，相对于浏览器窗口进行定位
    Relative 生成相对定位的元素，相对于正常位置进行定位

11. 常用的hack写法都有哦哪些？
    举例：+background-color：pink； +用于ie7
    _background-color:orange;专门留给神奇的ie6
    面试之前提前背一下不同浏览器的渲染引擎的css写法
    -webkit-color:red;
    -moz-
    -ms

12. img标签title与alt属性的区别是什么？
    Alt当图片不显示时 用文字代表
    Title 鼠标移上去的提示信 搜索引擎优化，一定会设置一个alt
    Css精灵图是把一堆小的图片整合到一张大的图片上，减轻服务器对图片的请求数量

13. 浏览器标准模式和怪异模式之间的区别是什么？
    Css3有个属性box-sizing：content-box/border-box
    Alt当图片不显示时 用文字代表