Complete CSS Reference

Page 1

Scripts | JavaScript Tutorials | JavaScript Reference | Applets | DHTML | Design | Forum | Freewarejava

JavaScript Kit CSS Reference (based on MSDN and WC3 CSS reference)
Last updated: October 21st, 2001

Search this site

Font | Color and Background | Text | Box | Classification | Positioning | Printing | Pseudo

- Font Properties
Property Valid Values Example font-family: Verdana, Arial; font-style:italic; font-variant:small-caps; font-weight:bold; font-size:12pt; font: bold 12pt Arial; Inherited? Y Y Y Y Y Y

font-family [font name or type] font-style fontvariant fontweight font-size font normal | italic normal | small-caps normal | bold [ xx-large | x-large | large | medium | small | x-small | xx-small ] | [ larger | smaller ] | percentage | length [ font-style || font-variant || font-weight ] ? font-size [ / line-height ] ? font-family

- Color and Background Properties
Property color background-color background-image background-repeat backgroundattachment background-position background Valid Values color color | transparent url | none repeat | repeat-x | repeat-y | no-repeat scroll | fixed [ position | length ] | {1,2} | [ top | center | bottom ] || [ left | center | right ] transparent | color || url || repeat || scroll || position Example color: red background-color: yellow background-image: url(house.jpg) background-repeat: no-repeat background-attachment: fixed background-position: top center background: silver url(house.jpg) repeat-y Inherited? Y N* N* N* N* N* N*

* Starting in CSS2, the properties indicated above are inherited.

- Text Properties
Property letter-spacing text-decoration vertical-align text-transform text-align text-indent line-height Valid Values normal | length none | underline | overline | line-through sub | super | capitalize | uppercase | lowercase | none left | right | center | justify length | percentage normal | number | length | percentage Example letter-spacing:5pt text-decoration:underline vertical-align:sub text-transform:lowercase text-align:center text-indent:25px line-height:15pt Inherited? Y N N N N N N

- Box Properties
http://www.javascriptkit.com/dhtmltutors/cssreference.shtml 14/02/2006 00:44:25

Classification Properties Property display list-style-type Valid Values none | block | inline | list-item disk | circle | square | decimal | lower-roman | upper-roman | loweralpha | upper-alpha | none Example display:none list-style-type:upper-alpha list-style-image:url(icFile.4} thin | medium | thick | length thin | medium | thick | length thin | medium | thick | length thin | medium | thick | length thin | medium | thick | length {1.4} none | solid | double | groove | ridge | inset | outset none | solid | double | groove | ridge | inset | outset none | solid | double | groove | ridge | inset | outset none | solid | double | groove | ridge | inset | outset none | solid | double | groove | ridge | inset | outset border-width | border-style | border-color border-width | border-style | border-color border-width | border-style | border-color border-width | border-style | border-color border-width | border-style | border-color none | left | right none | left | right | both Example margin-top:5px margin-right:5px margin-bottom:1em margin-left:5pt margin: 10px 5px 10px 5px padding-top:10% padding-right:15px padding-bottom:1.4} length | percentage length | percentage length | percentage length | percentage length | percentage {1. } border-top-style:solid border-right-style:double border-bottom-style:groove border-left-style:none border-style:ridge.2em padding-left:10pt.com/dhtmltutors/cssreference.javascriptkit.Complete CSS Reference Page 2 Property margin-top margin-right margin-bottom margin-left margin padding-top padding-right padding-bottom padding-left padding border-top-width border-right-width border-bottom-width border-left-width border-width border-top-color border-right-color border-bottom-color border-left-color border-color border-top-style border-right-style border-bottom-style border-left-style border-style border-top border-right border-bottom border-left border float clear Valid Values length | percentage | auto length | percentage | auto length | percentage | auto length | percentage | auto length | percentage | auto {1. } padding: 10px 10px 10px 15px border-top-width:thin border-right-width:medium border-bottom-width:thick border-left-width:15px border-width: 3px 5px 3px 5px border-top-color:navajowhite border-right-color:whitesmoke border-bottom-color:black border-left-color:#C0C0C0 border-color: green red white blue.gif) Inherited? N Y Y list-style-image url | none http://www.4} color color color color color {1. } border-top: medium outset red border-right: thick inset maroon border-bottom: 10px ridge gray border-left: 1px groove red border: thin solid blue float:none clear:left Inherited? N N N N N N N N N N N N N N N N N N N N N N N N N N N N N N N N .shtml 14/02/2006 00:44:25 .

n/a visited first-letter.com/dhtmltutors/cssreference.Pseudo Classes Property cursor Valid Values auto | crosshair | default | hand | move | e-resize | ne-resize | nw-resize | n-resize | se-resize | sw-resize | s-resize | w-resize | text | wait | help Example { cursor:hand. link. } p:first-letter{ float:left.Complete CSS Reference list-styleposition list-style inside | outside keyword || position || url list-style-position:inside list-style: square outside url (icFolder. hover.gif) Y Y Page 3 .color:blue } .shtml 14/02/2006 00:44:25 . SPAN and replaced elements absolutely and relatively positioned elements all elements all elements absolutely and relatively positioned elements all elements DIV. firstline any font manipulating declaration Scripts | JavaScript Tutorials | JavaScript Reference | Applets | DHTML | Design | Forum | Freewarejava CopyRight © 1998-2002 JavaScript Kit http://www. Inherited? Y Y N active. } a:hover { color:red. SPAN and replaced elements absolutely and relatively positioned elements Inherited? N N N N N N N N N .Positioning Properties Property Valid Values clip height left overflow position top visibility width z-index shape | auto length | auto length | percentage | auto visible | hidden | scroll | auto absolute| relative | static length | percentage | auto visible | hidden | inherit length | percentage | auto auto | integer Example clip:rect(0px 200px 200px 0px) height:200px left:0px overflow:scroll position:absolute top:0px visibility:visible width:80% z-index:-1 Applies to all elements DIV.Printing Properties Property page-break-before page-break-after Valid Values auto | always || left | right auto | always || left | right Example page-break-before:always page-break-before:auto Inherited? N N .javascriptkit.

Sign up to vote on this title
UsefulNot useful