Last active
December 30, 2015 03:59
-
-
Save johnsiwicki/7773415 to your computer and use it in GitHub Desktop.
CSS Cheat Sheet
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /* RGBA Color Specification */ | |
| background-color: rgba(255, 255, 255, 0.3); | |
| color: rgba(255, 255, 255, 0.3); | |
| /* Box Shadow Attributes *//* | |
| (Inset or No, Horiz. (px), Vert. (px), Blur Radius, Spread, Shadow Color) */ | |
| /* Box Shadow - Standard */ | |
| box-shadow: 0px 0px 5px 1px #444; | |
| /* Box Shadow - Inset */ | |
| box-shadow: inset 0px 0px 5px 1px #444; | |
| /* Text Shadow *//* | |
| Attributes: Horiz. [px], Vertical Length. [px], Blur Radius. [px], Shadow Color | |
| */text-shadow: 2px 2px 2px #ffffff; | |
| filter: dropshadow(color=#ffffff, offx=2, offy=2); | |
| /* Multiple Columns */ | |
| -moz-column-count: 2; | |
| -moz-column-gap: 10px; | |
| -webkit-column-count: 2; | |
| -webkit-column-gap: 10px; | |
| column-count: 2; | |
| column-gap: 10px; | |
| /* Box Resizing */ | |
| resize: both; | |
| /* horizontal, vertical or both */ | |
| overflow: auto; | |
| min-width: 50px; | |
| /* suggest a mid-width & min-height */ | |
| min-height 50px; | |
| /* Border Radius - Different Radius for each corner */ | |
| border-radius-topleft: 8px; | |
| border-radius-topright: 7px; | |
| border-radius-bottomright: 3px; | |
| border-radius-bottomleft: 2px; | |
| border-radius: 8px 7px 3px 2px; | |
| /* Box Sizing - Border Box Option */ | |
| -moz-box-sizing: border-box; | |
| -webkit-box-sizing: border-box; | |
| box-sizing: border-box; | |
| /* Box Sizing - Content Box Option */ | |
| -moz-box-sizing: content-box; | |
| -webkit-box-sizing: content-box; | |
| box-sizing: content-box; | |
| /* Outline - (Thickness, Style, Color) */ | |
| outline: 2px solid #cf4747; | |
| outline-offset: 10px; | |
| /*Delete if you don't want an offset*/ | |
| /* Transitions - (Property, Duration, Function) | |
| */ | |
| #myID {-webkit-transition: weight s ease;-moz-transition: weight s ease;-o-transition: weight s ease;transition: weight s ease;} | |
| /* Transforms - (Scale, Rotate, Translate, Skew) */ | |
| -moz-transform: scale(1) rotate(6deg) translate(0px, 0px) skew(0deg, 0deg); | |
| -webkit-transform: scale(1) rotate(6deg) translate(0px, 0px) skew(0deg, 0deg); | |
| -o-transform: scale(1) rotate(6deg) translate(0px, 0px) skew(0deg, 0deg); | |
| -ms-transform: scale(1) rotate(6deg) translate(0px, 0px) skew(0deg, 0deg); | |
| transform: scale(1) rotate(6deg) translate(0px, 0px) skew(0deg, 0deg); | |
| /* Gradients - generated by http://www.colorzilla.com/gradient-editor/ */ | |
| background: rgb(214,62,87); | |
| background: -moz-linear-gradient(top, rgba(214,62,87,1) 0%, rgba(112,22,26,1) 100%); | |
| background: -webkit-linear-gradient(top, rgba(214,62,87,1) 0%,rgba(112,22,26,1) 100%); | |
| background: -ms-linear-gradient(top, rgba(214,62,87,1) 0%,rgba(112,22,26,1) 100%); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment