Scribd
Upload
266 views

Css Properties

The document defines CSS properties for background, text, fonts, borders, outlines, margins, padding, lists, tables, dimensions, and classification. It provides descriptions and possible values for each property. An example is given using CSS to set the background color and image of a web page element.

Uploaded by

Giri Dharan R
Copyright
© Attribution Non-Commercial (BY-NC)
Available Formats
Download as DOC, PDF, TXT or read online on Scribd
266 views

Css Properties

The document defines CSS properties for background, text, fonts, borders, outlines, margins, padding, lists, tables, dimensions, and classification. It provides descriptions and possible values for each property. An example is given using CSS to set the background color and image of a web page element.

Uploaded by

Giri Dharan R
Copyright
© Attribution Non-Commercial (BY-NC)
Available Formats
Download as DOC, PDF, TXT or read online on Scribd
You are on page 1/ 8

CSS PROPERTIES:

Background
Parameter background-color Description Sets the background color of an element Values color-name color-rgb color-hex transparent url(URL) none

background-image background-repeat

Sets an image as the background

Sets if/how a background-image will be repeated repeat repeat-x repeat-y no-repeat Sets if a background-image should be fixed or should scroll with the page Sets the starting position of a background-image scroll fixed top left top center top right center left center center center right bottom left bottom center bottom right x% y% xpos ypos

background-attachment background-position

Example <html> <head> <script type="text/javascript"> function setStyle() { document.body.style.background="#FFCC80 url(bgdesert.jpg) repeat-y"; } </script> </head> <body> <input type="button" onclick="setStyle()" value="Set background style" /> </body> </html>

TEXT PROPERTIES
Property color direction line-height Description Sets the color of a text Sets the text direction Sets the distance between lines Values color ltr rtl normal number length % normal length left right center justify none underline overline line-through blink

letter-spacing text-align

Increase or decrease the space between characters Aligns the text in an element

text-decoration

Adds decoration to text

text-indent text-shadow

Indents the first line of text in an length element % none color length Controls the letters in an element none capitalize uppercase lowercase normal embed bidi-override Sets how white space inside an element is handled Increase or decrease the space between words normal pre nowrap normal length

text-transform

unicode-bidi

white-space

word-spacing

FONT PROPERTIES
Property font Description Values

A shorthand property for setting all font-style of the properties for a font in one font-variant declaration font-weight font-size/line-height font-family caption icon menu

message-box small-caption status-bar font-family A prioritized list of font family family-name names and/or generic family namesgeneric-family for an element Sets the size of a font xx-small x-small small medium large x-large xx-large smaller larger length % none number

font-size

font-size-adjust

Specifies an aspect value for an element that will preserve the xheight of the first-choice font

font-stretch

Condenses or expands the current normal font-family wider narrower ultra-condensed extra-condensed condensed semi-condensed semi-expanded expanded extra-expanded ultra-expanded Sets the style of the font normal italic oblique normal small-caps normal bold bolder lighter 100 200 300 400 500 600 700 800 900

font-style

font-variant font-weight

Displays text in a small-caps font or a normal font Sets the weight of a font

BORDER PROPERTIES:
Property border Description Values

A shorthand property for setting all of the border-width properties for the four borders in one border-style declaration border-color A shorthand property for setting all of the border-bottom-width properties for the bottom border in one border-style declaration border-color Sets the color of the bottom border Sets the style of the bottom border Sets the width of the bottom border border-color border-style thin medium thick length Color

border-bottom

border-bottom-color border-bottom-style border-bottom-width

border-color border-left

Sets the color of the four borders, can have from one to four colors

A shorthand property for setting all of the border-left-width properties for the left border in one border-style declaration border-color Sets the color of the left border Sets the style of the left border Sets the width of the left border border-color border-style thin medium thick length

border-left-color border-left-style border-left-width

border-right

A shorthand property for setting all of the border-right-width properties for the right border in one border-style declaration border-color Sets the color of the right border Sets the style of the right border Sets the width of the right border border-color border-style thin medium thick length none hidden dotted dashed solid double groove ridge inset outset

border-right-color border-right-style border-right-width

border-style

Sets the style of the four borders, can have from one to four styles

border-top

A shorthand property for setting all of the border-top-width properties for the top border in one border-style declaration border-color Sets the color of the top border Sets the style of the top border Sets the width of the top border border-color border-style thin

border-top-color border-top-style border-top-width

medium thick length border-width A shorthand property for setting the width of the four borders in one declaration, can have from one to four values thin medium thick length

OUTLINE PROPERTIES:
Property outline Description A shorthand property for setting all the outline properties in one declaration Sets the color of the outline around an element Sets the style of the outline around an element Values outline-color outline-style outline-width color invert none dotted dashed solid double groove ridge inset outset thin medium thick length

outline-color outline-style

outline-width

Sets the width of the outline around an element

MARGIN PROPERTIES:
Property margin Description Values

A shorthand property for setting the margin-top margin properties in one declaration margin-right margin-bottom margin-left Sets the bottom margin of an element Sets the left margin of an element auto length % auto length % auto length % auto length %

margin-bottom

margin-left

margin-right

Sets the right margin of an element

margin-top

Sets the top margin of an element

PADDING PROPERTIES:

Property padding

Description A shorthand property for setting all of the padding properties in one declaration Sets the bottom padding of an element Sets the left padding of an element

Values padding-top padding-right padding-bottom padding-left length % length %

padding-bottom padding-left padding-right padding-top

Sets the right padding of an element length % Sets the top padding of an element length %

LIST PROPERTIES:
Property list-style Description Values

A shorthand property for setting all of list-style-type the properties for a list in one list-style-position declaration list-style-image Sets an image as the list-item markernone url Sets where the list-item marker is placed in the list inside outside

list-style-image list-style-position list-style-type

Sets the type of the list-item marker none disc circle square decimal decimal-leading-zero lower-roman upper-roman lower-alpha upper-alpha lower-greek lower-latin upper-latin hebrew armenian georgian cjk-ideographic hiragana katakana hiragana-iroha katakana-iroha

TABLE PROPERTIES:

Property border-collapse

Description

Values

Sets whether the table borders are collapse collapsed into a single border or detached separate as in standard HTML Sets the distance that separates cell length length borders (only for the "separated borders" model) Sets the position of the table caption top bottom left right

border-spacing

caption-side

empty-cells

Sets whether or not to show empty cells show in a table (only for the "separated hide borders" model) Sets the algorithm used to display the table cells, rows, and columns auto fixed

table-layout

DIMENTION PROPERTIES:
Property height Description Sets the height of an element Values auto length % normal number length %

line-height

Sets the distance between lines

max-height

Sets the maximum height of an element none length % Sets the maximum width of an element none length % length % length % auto % length

max-width

min-height min-width width

Sets the minimum height of an element Sets the minimum width of an element Sets the width of an element

CLASSIFICATION:
Property clear Description Values

Sets the sides of an element where other left floating elements are not allowed right both none Specifies the type of cursor to be displayed url() auto crosshair

cursor

default pointer move e-resize ne-resize nw-resize n-resize se-resize sw-resize s-resize w-resize text wait help display Sets how/if an element is displayed none inline block list-item run-in compact marker table inline-table table-row-group table-header-group table-footer-group table-row table-column-group table-column table-cell table-caption

float

Sets where an image or a text will appear left in another element right none Places an element in a static, relative, absolute or fixed position static relative absolute fixed visible hidden collapse

position

visibility

Sets if an element should be visible or invisible

You might also like