CSS Reference

CSGNetwork FREE Source Code, Javascript Source, and Code Snippets!

CSGNetwork Custom Search

CSGNetwork

Back

Right click this window and select "view source" in order to copy the source for this script.

CSS Reference (based on MSDN and WC3 CSS reference)

- Font Properties

Property	Valid Values	Example	Inherited?
font-family	[font name or type]	font-family: Verdana, Arial;	Y
font-style	normal \| italic	font-style:italic;	Y
font-variant	normal \| small-caps	font-variant:small-caps;	Y
font-weight	normal \| bold	font-weight:bold;	Y
font-size	[ xx-large \| x-large \| large \| medium \| small \| x-small \| xx-small ] \| [ larger \| smaller ] \| percentage \| length	font-size:12pt;	Y
font	[ font-style \|\| font-variant \|\| font-weight ] ? font-size [ / line-height ] ? font-family	font: bold 12pt Arial;	Y

- Color and Background Properties

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

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

- Text Properties

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

- Box Properties

Property	Valid Values	Example	Inherited?
margin-top	length \| percentage \| auto	margin-top:5px	N
margin-right	length \| percentage \| auto	margin-right:5px	N
margin-bottom	length \| percentage \| auto	margin-bottom:1em	N
margin-left	length \| percentage \| auto	margin-left:5pt	N
margin	length \| percentage \| auto {1,4}	margin: 10px 5px 10px 5px	N
padding-top	length \| percentage	padding-top:10%	N
padding-right	length \| percentage	padding-right:15px	N
padding-bottom	length \| percentage	padding-bottom:1.2em	N
padding-left	length \| percentage	padding-left:10pt; }	N
padding	length \| percentage {1,4}	padding: 10px 10px 10px 15px	N
border-top-width	thin \| medium \| thick \| length	border-top-width:thin	N
border-right-width	thin \| medium \| thick \| length	border-right-width:medium	N
border-bottom-width	thin \| medium \| thick \| length	border-bottom-width:thick	N
border-left-width	thin \| medium \| thick \| length	border-left-width:15px	N
border-width	thin \| medium \| thick \| length {1,4}	border-width: 3px 5px 3px 5px	N
border-top-color	color	border-top-color:navajowhite	N
border-right-color	color	border-right-color:whitesmoke	N
border-bottom-color	color	border-bottom-color:black	N
border-left-color	color	border-left-color:#C0C0C0	N
border-color	color {1,4}	border-color: green red white blue; }	N
border-top-style	none \| solid \| double \| groove \| ridge \| inset \| outset	border-top-style:solid	N
border-right-style	none \| solid \| double \| groove \| ridge \| inset \| outset	border-right-style:double	N
border-bottom-style	none \| solid \| double \| groove \| ridge \| inset \| outset	border-bottom-style:groove	N
border-left-style	none \| solid \| double \| groove \| ridge \| inset \| outset	border-left-style:none	N
border-style	none \| solid \| double \| groove \| ridge \| inset \| outset	border-style:ridge; }	N
border-top	border-width \| border-style \| border-color	border-top: medium outset red	N
border-right	border-width \| border-style \| border-color	border-right: thick inset maroon	N
border-bottom	border-width \| border-style \| border-color	border-bottom: 10px ridge gray	N
border-left	border-width \| border-style \| border-color	border-left: 1px groove red	N
border	border-width \| border-style \| border-color	border: thin solid blue	N
float	none \| left \| right	float:none	N
clear	none \| left \| right \| both	clear:left	N

- Classification Properties

Property	Valid Values	Example	Inherited?
display	none \| block \| inline \| list-item	display:none	N
list-style-type	disk \| circle \| square \| decimal \| lower-roman \| upper-roman \| lower-alpha \| upper-alpha \| none	list-style-type:upper-alpha	Y
list-style-image	url \| none	list-style-image:url(icFile.gif)	Y
list-style-position	inside \| outside	list-style-position:inside	Y
list-style	keyword \|\| position \|\| url	list-style: square outside url(icFolder.gif)	Y

- Positioning Properties

Property	Valid Values	Example	Applies to	Inherited?
clip	shape \| auto	clip:rect(0px 200px 200px 0px)	all elements	N
height	length \| auto	height:200px	DIV, SPAN and replaced elements	N
left	length \| percentage \| auto	left:0px	absolutely and relatively positioned elements	N
overflow	visible \| hidden \| scroll \| auto	overflow:scroll	all elements	N
position	absolute\| relative \| static	position:absolute	all elements	N
top	length \| percentage \| auto	top:0px	absolutely and relatively positioned elements	N
visibility	visible \| hidden \| inherit	visibility:visible	all elements	N
width	length \| percentage \| auto	width:80%	DIV, SPAN and replaced elements	N
z-index	auto \| integer	z-index:-1	absolutely and relatively positioned elements	N

- Printing Properties

Property	Valid Values	Example	Inherited?
page-break-before	auto \| always \|\| left \| right	page-break-before:always	N
page-break-after	auto \| always \|\| left \| right	page-break-before:auto	N

- Pseudo Classes

Property	Valid Values	Example	Inherited?
cursor	auto \| crosshair \| default \| hand \| move \| e-resize \| ne-resize \| nw-resize \| n-resize \| se-resize \| sw-resize \| s-resize \| w-resize \| text \| wait \| help	{ cursor:hand; }	Y
active, hover, link, visited	n/a	a:hover { color:red; }	Y
first-letter, first-line	any font manipulating declaration	p:first-letter{ float:left;color:blue } .	N