Just Because It’s Ridiculous Doesn’t Mean It’s Stoopid
-
Upload
john-bristowe -
Category
Self Improvement
-
view
1.298 -
download
1
description
Transcript of Just Because It’s Ridiculous Doesn’t Mean It’s Stoopid
Just Because It’s Ridiculous Doesn’t Mean It’s Stoopid
John Bristowe | @JohnBristowe
gradientsbox-shadow
.gradient-bg { background-color: #1a82f7; background-image: url(images/fallback-gradient.png); background-image: -webkit-gradient(linear, 0% 0%, 0% 100%,
from(#2F2727), to(#1a82f7)); background-image: -webkit-linear-gradient(top, #2F2727, #1a82f7); background-image: -moz-linear-gradient(top, #2F2727, #1a82f7); background-image: -ms-linear-gradient(top, #2F2727, #1a82f7); background-image: -o-linear-gradient(top, #2F2727, #1a82f7);}
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,
startColorstr=#1471da, endColorstr=#1C85FB);-ms-filter: "progid:DXImageTransform.Microsoft.gradient (GradientType=0, startColorstr=#1471da, endColorstr=#1C85FB)";
#lol { -moz-box-shadow: 10px 10px 5px #888; -webkit-box-shadow: 10px 10px 5px #888; box-shadow: 10px 10px 5px #888;}
1. box-shadow is fun and simple
2. gradients are fun but tricky
3. Mo browsers, mo problems
April 20, 2011
Doug Avery
“39 Ridiculous Things To Do With
CSS3 Box Shadows”
Conversions are simple
box-shadow in IE9+
Gradients in IE10+
-webkit-transition-ms-transition
-webkit-border-radius
border-radius
-webkit-gradient-ms-radial-gradient
1. box-shadow is fun and simple2. gradients are fun but tricky3. Mo browsers, mo problems
1. box-shadow is fun and simple2. gradients are fun but tricky3. Mo browsers, mo problems
westciv.com/tools/gradients
gradients.glrzad.comcolorzilla.com/gradient-
editor
John Bristowe@JohnBristowe