|
一． 定位拓展 1. 绝对定位的盒子居中问题 1.加了绝对定位的盒子不能通过margin：0 auto 进行水平居中，但是可以通过计算的方式的进行水平和垂直居中 2.水平居中的方法：先将左边偏移50%；；是用margin-left让盒子往左偏移自己宽的一半 2. 不论是什么元素，使用固定定位或者绝对定位之后都可以设置宽高：；； 3. 脱标的盒子不会发生外边距塌陷的问题；；；； 4. 固定定位和绝对定位都会完全压住下面的盒子。。 5. 元素的显示和隐藏: 1. display显示与隐藏：除了转化块，还能将元素显示出来：；；属性值：none 隐藏；；；；display 来隐藏元素时，隐藏的元素不在占有原来的位置 一般会在js一起搭配使用 2. visibility显示与隐藏：属性值：hidden 隐藏 但是元素还是占着原来的位置； ；；；visible：元素可视 3. overflow显示与隐藏：属性值：visible：不剪切内容，也不添加滚动条；；；；hidden：将超出盒子的内容给隐藏掉；；；；scroll：不管盒子里面的内容有没有超出盒子，都显示滚动条；；；auto：内容超出盒子的话会有滚动条，不超出就不会显示 6. CSS常用技巧 1. 精灵图：使用原因;将多张小的图片整合到一张大的图片中返回给浏览器，可以减少服务器的重复请求，以减轻服务器的压力 2. 使用方法，利用背景图片的方法把精灵图插入；；；将精灵图移动到指定位置即可，理由的属性时bacground-position，，一般移动的都是负值。 7. 鼠标样式 1. 属性cursor：default：默认的鼠标样式 2. pointer：小手的鼠标样式；；； 3. text ： 文本鼠标样式；； 4. move： 拖动的鼠标样式；；；； 5. not-allowed：禁止标签 8. 9. 输入框：删除输入外框：outline：none 1. 文本域取消拖拽：热死则：none； 2. 行内元素对齐：vertical-align：top-顶线对齐；middle-中线对齐；；baseline-基线对齐；；botton-底线对齐 10. 三角制作： 11. 省略号： 1. 让文字一行显示 2. 将多余的文字隐藏掉 3. 用省略号代替隐藏的文字 12. CSS的滑动门：行内块居中 text-algin：center
| 
