欢迎各位兄弟 发布技术文章
这里的技术是共享的
画圆 有大用
通过设置一个较大的圆角值就能实现圆形,下面画了一个直径为100的圆。
.circle { width: 100px; height: 100px; -moz-border-radius: 100px; -webkit-border-radius: 100px; }
内阴影效果 有大用
box-shadow的第一个值是阴影类型,默认是外阴影,平常我们使用它都不会设置这个值,所以就是外阴影的效果。如果要实现内阴影效果,需要手动设值:inner 。
.inset { -moz-box-shadow: inset 0 3px 8px rgba(0,0,0,.4); -webkit-box-shadow: inset 0 3px 8px rgba(0,0,0,.4); box-shadow: inset 0 3px 8px rgba(0,0,0,.24); }
搜索框
回到开始的例子,本例使用了CSS gradient, border-radius, 内阴影效果的box-shadow
来自 http://www.cnblogs.com/william-lin/archive/2013/06/08/3126561.html