第二十一章 CSS渐变效果 一、线性渐变 linear-gradient（方位，起始色，末尾色） (1) 方位 ：可选参考数，渐变的方位。可以使用的值：to top、to top right、to right、to bottom、to bottom left、to left、to top left。 ...
分类：
Web程序 时间：
2018-02-28 19:45:59
阅读次数：
233
.but1{ padding: 10px 20px; font-size: 16px; text-shadow: 2px 2px 3px rgba(0,0,0,0.8); border-radius: 20px; background: linear-gradient(to left,orange, ...
分类：
Web程序 时间：
2017-11-07 22:07:50
阅读次数：
185
原文地址 今天我们来探索一下Carl Philipe Brenner的网站上一个微妙而有趣的动画效果。当鼠标经过网格元素时，会有一个微妙的动画发生——网格元素变得透明，每条边有个顺时针的动画，创造了非常好的效果。这种效果是通过JS给span标签的宽或者高做了动画。我们待会会用SVG和CSS渐变来完成 ...
分类：
Web程序 时间：
2017-09-17 15:09:50
阅读次数：
364
1、线性渐变 （1）使用方向（point） （2）使用角度（angle） 角度方向为什么呢？ （3）有多种颜色存在 （4）透明和渐变 使用透明度来到达图片渐变的效果，实际上是在背景图片上添加一个线性渐变，让白色由浅至深，则图片看起来会由清晰至模糊 rgba中的透明度与opacity中的value是一 ...
分类：
Web程序 时间：
2017-07-15 19:04:22
阅读次数：
308
将角切掉也是一种流行的设计风格 传统解决方案可能是使用三角形或者其他形状的图片来盖住边角从而模拟切角效果 有了CSS3,我们完全可以使用新技术来实现 第一种方案: CSS渐变 需求一: 一个矩形需要切掉一个45°角 使用线性渐变来实现 background: #58a linear-gradient ...
分类：
Web程序 时间：
2017-05-29 21:43:35
阅读次数：
169
CSS border-image 属性 border-image属性很容易记，它允许你将图片或CSS渐变形状作为一个元素的边框。 .module {border-image: url(border.png) 25 25 round;} 该属性能被应用于任何元素，但当表格元素（如` tr,th,td ...
分类：
Web程序 时间：
2017-05-14 12:11:55
阅读次数：
2076
border-radius实现特殊形状 border-radius属性值分为了四组，顺时针表示圆角半径大小 阴影特殊效果实现 css 渐变效果设置 ...
分类：
Web程序 时间：
2017-04-22 18:53:05
阅读次数：
197
html5: 用于绘画的 canvas 元素 用于媒介回放的 video 和 audio 元素 对本地离线存储的更好的支持 新的特殊内容元素，比如 article、footer、header、nav、section 新的表单控件，比如 calendar、date、time、email、url、sea ...
分类：
Web程序 时间：
2017-03-18 18:14:01
阅读次数：
171
转载自：https://developer.mozilla.org/zh-CN/docs/Web/Guide/CSS/Using_CSS_gradients CSS 渐变 是在 CSS3 Image Module 中新增加的 <image> 类型. 使用 CSS 渐变可以在两种颜色间制造出平滑的渐变 ...
分类：
Web程序 时间：
2017-02-24 23:40:04
阅读次数：
353
通过CSS渐变创建的是一个没有固定比例和固定尺寸的<image>类型，也就是说是一张图片，这张图片的尺寸由所应用的元素的相关信息决定。凡是支持图片类型的CSS属性都可以设置渐变，而支持颜色值的CSS属性就不能设置渐变。比如，background-image可以设置渐变，background-colo ...
分类：
Web程序 时间：
2016-12-08 18:12:53
阅读次数：
363
