高级技巧

元素的显示与隐藏

display

visibility

overflow

opacity

鼠标样式

cursor :  default  小白 | pointer  小手  | move  移动  |  text  文本

防止拖拽文本域resize

outline : outline-color ||outline-style || outline-width

轮廓

outline : outline-color ||outline-style || outline-width

 

垂直对齐

vertical-align : baseline |top |middle |bottom 

高级技巧

 

 

去除图片底侧空白缝隙

 

1、两者之间有默认外边距的解决方法

修改父级元素字体尺寸:font-size:0; 

2、给img 添加 display:block; 转换为块级元素就不会存在问题了

3.注释

两个相邻的行内块其中一个设置外边距另一个也受影响的原因和解决办法

1、外边距受影响的解决办法:

修改内联元素对齐属性:vertical-align:top;

溢出的文字隐藏

word-break

white-space

text-overflow、

高级技巧

 

 

.CSS精灵技术

这将大大降低页面的加载速度。为了有效地减少服务器接受和发送请求的次数,提高页面的加载速度,出现了CSS精灵技术(也称CSS Sprites、CSS雪碧)。

 

上一篇:vertical-align,vertical-align 用来指定行内元素(inline)或表格单元格(table-cell)元素的垂直对齐方式


下一篇:css难点合集