笔记-CSS3实现3D搜索输入框_html/css_WEB-ITnose
时间:2021-07-01 10:21:17
帮助过:25人阅读
题外话
今天拜读了大漠的<<图解CSS3>>发现里面这个按钮的实例挺赞的,稍微完善了一下原来例子.
去掉一些现在不用的前缀,补全了最终版的.clearfix,还有样式稍作修改~~
原版效果图:
预备知识
基础布局知识 CSS2.1 && CSS3 制作原理(CSS3特性)
- box-shadow ? 盒子阴影 -> 使用多层阴影达到立体效果
- box-image:linear-gradient -> 渐变效果实现….
- box-radius: ? 实现圆角效果
- text-shadow: ? 文本阴影
- 其他的都是CSS2.1的属性,就不用多说了..
代码实现
因为代码量不是很多,就木有分离CSS了…
制作3D搜索表单
修改版效果图
版权声明:本文为博主原创文章,未经博主允许不得转载。