Summary of css attribute codes (1)_html/css_WEB-ITnose

One CSS text attribute:

color : #999999; /*Text color*/

font-family : Song Dynasty, sans-serif; /*Text font*/

font-size : 9pt; /*Text size*/

font-style:itelic; /*Text italic*/

font-variant:small-caps; /*Small font*/

letter-spacing: 1pt; /*Distance between words*/

line-height: 200%; /*Set line height*/

font-weight:bold; /*Bold text*/

vertical-align:sub; /*Subscript*/

vertical-align:super; /*Superscript */

text-decoration:line-through; /*Add strikethrough*/

text-decoration: overline; /*Add top line*/

text- decoration:underline; /*Add underline*/

text-decoration:none; /*Remove link underline*/

text-transform : capitalize; /*Capitalize the first word*/

text-transform : uppercase; /*English uppercase*/

text-transform : lowercase; /*English lowercase*/

text-align:right; /*Text right Alignment*/

text-align:left; /*Text left alignment*/

text-align:center; /*Text center alignment*/

text-align :justify; /*Text alignment*/

vertical-align attribute

vertical-align:top; /*Vertical alignment*/

vertical-align:bottom ; /*Align vertically downwards*/

vertical-align:middle; /*Align vertically in the middle*/

vertical-align:text-top; /*Align text vertically upwards*/

vertical-align:text-bottom; /*Align text vertically downward*/

2. CSS border blank

padding-top:10px; /*Top border Leave blank*/

padding-right:10px; /*Leave blank right border*/

padding-bottom:10px; /*Leave blank bottom border*/

padding-left:10px; /*Leave the left border blank

3. CSS symbol attributes:

list-style-type:none; /*No numbering*/

list-style-type:decimal; /*Arabic numerals*/

list-style-type:lower-roman; /*Lowercase Roman numerals*/

list-style-type:upper -roman; /*Uppercase Roman numerals*/

list-style-type:lower-alpha; /*Lowercase English letters*/

list-style-type:upper-alpha; / *Capital English letters*/

list-style-type:disc; /*Solid circular symbol*/

list-style-type:circle; /*Hollow circular symbol*/

list-style-type:square; /*Solid square symbol*/

list-style-image:url(/dot.gif); /*Picture-style symbol*/

list-style-position: outside; /*convex row*/

list-style-position:inside; /*indent*/

4. CSS background style:

background-color:#F5E2EC; /*Background color*/

background:transparent; /*Perspective background*/

background-image: url(/image/ bg.gif); /*Background image*/

background-attachment : fixed; /*Watermark fixed background*/

background-repeat : repeat; /*Repeat arrangement - web page default */

background-repeat : no-repeat; /*No repeat arrangement*/

background-repeat : repeat-x; /*Repeat arrangement on the x-axis*/

background-repeat : repeat-y; /*Repeat the arrangement on the y-axis*/

Specify the background position

background-position : 90% 90%; /*Background image x and y Axis position*/

background-position : top; /*Align upward*/

background-position : buttom; /*Align downward*/

background- position : left; /*Align left*/

background-position : right; /*Align right*/

background-position : center; /*Align center*/

5. CSS connection attributes:

a /*All hyperlinks*/

a:link /*Hyperlink text format*/

a:visited /*Browsed link text format*/

a:active /*Format of pressed link*/

a:hover /*Mouse to link*/

Mouse cursor style:

Link finger CURSOR: hand

crosshair cursor: crosshair

arrow pointing down cursor: s-resize

cross arrow cursor :move

Arrow to the right cursor:move

Add a question mark cursor:help

Arrow to the left cursor:w-resize

Arrow to the up cursor :n-resize

The arrow points to the upper right cursor:ne-resize

The arrow points to the upper left cursor:nw-resize

Text I-type cursor:text

Arrow diagonally lower right cursor:se-resize

Arrow diagonally lower left cursor:sw-resize

Funnel cursor:wait

Cursor pattern (IE6) p {cursor:url( "Cursor file name.cur"),text;}

6. CSS border list:

border-top: 1px solid #6699cc; /*Top border*/

border-bottom : 1px solid #6699cc; /*bottom border*/

border-left : 1px solid #6699cc; /*Left border line*/

border-right : 1px solid #6699cc; /*Right border line*/

The above is the recommended writing method, But you can also use the conventional method as follows:

border-top-color : #369 /*Set the top color of the top border*/

border-top-width: 1px /*Set the top Border top width*/

border-top-style: solid/*Set the border top style*/

Other border styles

solid /*Solid line Frame*/

dotted /*dotted frame*/

double /*double frame*/

groove /*three-dimensional convex frame*/

ridge /*three-dimensional relief frame*/

inset /*concave frame*/

outset /*convex frame*/

7. CSS form application:

Text box

Button

Checkbox

Select button

Multi-line text box

Drop-down menu option 1 Option 2

8. CSS border style:

margin-top:10px; /*upper border*/

margin-right:10px; /*right margin value* /

margin-bottom:10px; /*Lower margin value*/

margin-left:10px; /*Left margin value*/