CSS高级样式

时间:2021-01-13 10:48:30   收藏:0   阅读:0

1 元素的显示与隐藏

 


 

1.1 display(使用较多,配合js做特效,比如下拉菜单,原先没有,鼠标经过,显示下拉菜单,应用广泛)

1.2 visibility

1.3 overflow(可以清除浮动,保证盒子里面的内容不会超出盒子范围)

2 CSS用户界面样式

 


 

2.1 鼠标样式cursor

2.2 轮廓 outline

2.3 防止拖拽文本域 resize

3 vertical-align 垂直居中(只针对行内元素、行内块元素垂直居中)

 

 


 

3.1 图片、表单和文字对齐

3.2 去除图片底部空白样式

4 溢出的文字用省略号显示

 


 

5 CSS精灵技术(sprite)为了有效的减少服务器接收和发送请求的次数,提高页面加载的速度。

 


 

5.1 制作精灵图

6 滑动门

 


 

为了使各种特殊形状的背景能够自适应元素中文本内容的多少,出现了CSS滑动门技术。它从新的角度构建页面,使各种特殊形状的背景能够自由拉伸滑动,以适应元素内部文本内容,可用性更强。最常见用于各种导航栏的滑动门。

7 拓展

 


 

 

7.1 margin负值之美

7.2 CSS三角形之美

 

可以模拟三角形效果,只保留一个边框,其他都改为透明色。font-size ling-height 照顾低版本浏览器兼容性

 

评论(0
© 2014 mamicode.com 版权所有 京ICP备13008772号-2  联系我们:gaon5@hotmail.com
迷上了代码!