Está en la página 1de 1

SantosVZ CSS3 Help Sheet

Equally Rounded Corners Text Shadow Box Resize


-webkit-border-radius Webkit text-shadow resize both
-moz-border-radius Firefox vertical
Syntax horizontal
border-radius Standard
5px 5px 5px #000000 min-height
Individually Rounded Corners x-offset, y-offset, blur, color min-width
filter: dropshadow( )
Webkit overflow: auto
-webkit-border-top-left-radius Syntax
-webkit-border-top-right-radius Outline
(color=#000000, offx=5, offy=5)
-webkit-border-bottom-left-radius outline
color, x-offset, y-offset
-webkit-border-bottom-right-radius Syntax
Firefox RGBA 5px dashed #000000
-moz-border-radius-topleft thickness, style, color
background-color: rgba(R, G, B, A)
-moz-border-radius-topright
color: rgba(R, G, B, A) Gradients
-moz-border-radius-bottomleft
-moz-border-radius-bottomright Syntax -webkit-gradient
Standard 255, 255, 255, 1 Syntax

border-top-left-radius Red, Green, Blue, Opacity linear


border-top-right-radius (0-255, 0-255, 0-255, 0-1) type of gradient
left bottom
border-bottom-left-radius
right bottom
border-bottom-right-radius Font Face left top
@font-face right top
Box Shadow position of start & end
font-family: ‘ ’; color-stop(0.5, rgb(R,G,B))
-webkit-box-shadow Webkit src: url(’ url_of_font_file‘); position & color of stops
-moz-box-shadow Firefox src: local(’ ‘),
url(’ url_of_font.woff‘) format(’woff ‘), -moz-linear-gradient
box-shadow Standard
url(’url_of_font.ttf’) format(’truetype’); Syntax
Syntax left
More info by Paul Irish: http://bit.ly/cC76RC
5px 5px 5px #000000 right
top
x-offset, y-offset, blur, color Box Sizing bottom
box-sizing: content-box position of start & end
Multiple Columns rgb(R, G, B) 50%
-moz-box-sizing: content-box
position & color of stops
Webkit -webkit-box-sizing: content-box
-webkit-column-count -ms-box-sizing: content-box Selectors
-o-box-sizing: content-box;
-webkit-column-gap
-icab-box-sizing: content-box; Incredibly powerful,
Firefox but we couldn’t
-khtml-box-sizing: content-box; possibly fit them on
-moz-column-count
Syntax this sheet.
-moz-column-gap
content-box Info at 456 Berea Street:
Standard acts like a standard box-model element
http://bit.ly/cKO24D

column-count border-box CSS3 is not yet supported in


column-gap padding and border render inside the box all browsers. Graceful
degradation in older browsers
Espero que les sea de mucha utilidad such as IE6 (arghh) is highly
recommended.

También podría gustarte