码迷,mamicode.com
首页 > Web开发 > 详细

css3实现渐变

时间:2018-03-30 20:06:41      阅读:185      评论:0      收藏:0      [点我收藏+]

标签:技术分享   blog   分享图片   如何   web   高度   opener   -o   技术   

chrome,苹果浏览器:—webkit-

firebox浏览器:-moz-

Opera浏览器:-o-

渐变分为:线性渐变(Linear Gradients)向下/向上/向左/向右/对角方向

径向渐变(Radial Gradients) 由中心定义

 

技术分享图片
从上到下的线性渐变
技术分享图片
如何创建一个带有彩虹颜色和文本的线性渐变
技术分享图片
从左到右的线性渐变,带有透明度

径向渐变:

技术分享图片
颜色结点均匀分布的径向渐变

css3的圆角radius不支持IE6 7 8

图片img圆角没有反应,overflow:hidden

a标签没有高度,可以用display:inline-block解决这个问题。

就先这些,遇到的以后再来加

css3实现渐变

标签:技术分享   blog   分享图片   如何   web   高度   opener   -o   技术   

原文地址:https://www.cnblogs.com/arlene-j/p/8677792.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!