今天完成的事情：看了一些css

标准的CSS的盒子模型与低版本IE的盒子模型有什么不同的

区 别： IE的content部分把 border 和 padding计算了进去

box-sizing属性

用来控制元素的盒子模型的解析模式，默认为content-box

context-box：W3C的标准盒子模型，设置元素的 height/width 属性指的是content部分的高/宽

border-box：IE传统盒子模型。设置元素的height/width属性指的是border + padding + content部分的高/宽

css选择器：

⑴标签选择器： p { font-size : 18 px; color:#000; }

⑵类选择器： .red { background-color:#C00; }

⑶id选择器： #firstColunm{ height:100px; background-color:#000; }

⑷后代选择器（包含选择器）： h1 em { color:#C00; }

⑸子元素选择器： h1 > strong { color:#C00; font-weight:bold; }

⑹通配选择器： * { padding:0; margin:0 }

⑺属性选择器： a[href] { color:#C00; }

⑻伪类选择器： a:hover { color:#C00; }    p:first-child { font-weight:bold; }

⑼伪元素： .clearfix:after { content:""; display:table; clear:both; }

⑽相邻兄弟选择器(只能选择两个相邻兄弟的第二个元素)： h1 + p { margin-top:50px; }

⑾兄弟选择器（选择该元素的所有兄弟）： h1 ~ p { line-height:30px; }

px、em、rem的区别？

1、px像素。绝对单位，像素px是相对于显示器屏幕分辨率而言的，是一个虚拟单位。是计算机系统的数字化图像长度单位，如果px要换算成物理长度，需要指定精度DPI。

2、em是相对长度单位，相对于当前对象内文本的字体尺寸。如当前对行内文本的字体尺寸未被人为设置，则相对浏览器的默认字体尺寸。它会继承父级元素的字体大小，因此并不是一个固定的值。

rem是CSS3新增的一个相对单位(root em,根em),使用rem为元素设定字体大小事，仍然是相对大小但相对的只是HTML根元素。

4、区别：IE无法调用那些使用px作为单位的字体大小，而em和rem可以缩放，rem相对的只是HTML根元素。这个单位可谓集相对大小和绝对大小的优点于一身，通过它既可以做到只修改根元素就成比例地调整所有字体大小，又可以避免字体大小逐层复合的连锁反应。目前，除了IE8及更早版本外，所有浏览器已支持rem。

CSS3新特性有哪些？

1、颜色：新增RGBA、HSLA模式

2、文字阴影(text-shadow)

3、边框：圆角（border-radius）边框阴影：box-shadow

4、盒子模型：box-sizing

5、背景：background-size设置背景图片的尺寸，background-origin设置背景图片的原点，background-clip设置背景图片的裁剪区域，以“，”分隔可以设置多背景，用于自适应布局

6、渐变：linear-gradient、radial-gradient

7、过渡：transition可实现动画

8、自定义动画

9、在CSS3中唯一引入的伪元素是::selection

10、多媒体查询、多栏布局

11、border-image

12、2D转换：transform:translate(x,y)rotate(x,y)skew(x,y)scale(x,y)

13、3D转换

标签上title与alt属性的区别是什么？

Alt当图片不显示时，用文字代表

Title为该属性提供信息

描述css reset的作用和用途？

Reset重置浏览器的css默认属性，浏览器的品种不同，样式不同，然后重置，让他们统一。

解释css sprites如何使用？

css 精灵图，把一堆小的图片整合到一张大的图片（png）上，减轻服务器对图片的请求数量。

为什么要使用css sprites

css精灵 把一堆小的图片整合到一张大的图片上，减轻服务器对图片的请求数量

css sprites其实就是把网页中一些背景图片整合到一张图片文件中，再利用css的"background-image","background-position"的组合进行背景定位。

在新窗口打开链接的方法是？

target:_blank

合理的页面布局中常听过结构与表现分离，那么结构是什么？表现是什么？

结构是html,表现是css

简述对Web语义化的理解？

就是让浏览器更好的读懂你写的代码，在进行HTML结构、表现、行为设计时，尽量使用语义化的标签，使程序代码简洁明了，易于进行web操作和网站SEO，方便团队的一种标准，以图实现一种“无障碍”的web开发。

选择器优先级是怎样的？

！important>行内样式>id选择器>类选择器>标签选择器>通配符>继承

box-sizing、transition、translate分别是什么？

1、box-sizing:用来指定模型的大小的计算方式。主要分为border-box(从边框固定盒子大小)、content-box(从内容固定盒子大小)两种计算方式。

2、transition:当前元素只要有"属性"发生变化时，可以平滑的进行过渡。通过transition-propety设置过渡属性；transition-duration设置过渡时间；transition-timing-function设置过渡速度；transition-delay设置过渡延时。

3、translate：通过移动改变元素的位置；有x,y,z三个属性

 position的值

static（默认）：按照正常文档流进行排列；

relative（相对定位）：不脱离文档流，参考自身静态位置通过 top, bottom, left, right 定位；

absolute(绝对定位)：参考距其最近一个不为static的父级元素通过top, bottom, left, right 定位；

fixed(固定定位)：所固定的参照对像是可视窗口。