Color Values
These are the values for color properties supported:
Keywords (Navy)
Hex (#000080)
RGB (0, 0, 128)
RGBA (0, 0, 128, 0.5)
HSL (240, 100%, 25%)
HSLA (240, 100%, 25%, 0.5)
Effects on Text
Opacity (0.5)
Text Shadow
Text Shadow with 2 colors
White-space Nowrap with Text Overflow Ellipsis
White-space Nowrap with Text Overflow Clip
Marquee (5x)
Text Stroke and Fill
Font-smoothing none
Font-smoothing antialiased
Font-smoothing auto
Effects on Other Elements
Border Radius 10px
Border Radius TL / TR 1.5em
Zoom (1.25)
Box Shadow
Multiple Background
text
...
.opacity { opacity: .5; } .text-shadow { text-shadow: 2px 2px 2px #666; } .text-shadow2 { text-shadow: 3px 3px 2px red, -3px -3px 2px green; } .ellipsis { width: 280px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } .clip { width: 280px; white-space: nowrap; text-overflow: clip; overflow: hidden; } .marquee { white-space: nowrap; overflow-x: -webkit-marquee; -webkit-marquee-repetition: 5 } .stroke-fill { -webkit-text-stroke: 1px purple; -webkit-text-fill-color: white; } .font-smooth { -webkit-font-smoothing: antialiased; } .font-jaggy { -webkit-font-smoothing: none; } .round-corner { background-color: olive; color: #fff; width: 240px; padding: 10px; border-radius: 10px; } .round-corner2 { ... border-top-left-radius: 1.5em; border-top-right-radius: 1.5em; } .zoom { zoom: 1.25; } .box-shadow { width: 240px; padding:5px; -webkit-box-shadow: 3px 4px 8px rgba(0,0,0,.6); } .multi-bkgd { background: url(images/bkgd-blue.jpg) no-repeat, url(images/bkgd-stones.png) no-repeat, 0% 0%; }