Home > Article > Web Front-end > What types of css properties are there?
css属性类型有：1、html标签；2、CSS文字属性；3、CSS符号属性；4、CSS背景样式；5、CSS表单运用；6、CSS边界样式。
本教程操作环境：windows7系统、css3版，DELL G3电脑。
css属性类型有：
一、html标签
e03b848252eb9375d56be284e690e873...bc5574f69a0cba105bc93bd3dc13c4ec文字格式化
dc6dce4a544fdca2df29d5ac0ea9906b......16b28748ea4df4d9c2150843fecfba68Column block container
Font size change6204e19e0330f923081a4c16d4055266The word you want to entere6e38b3c62e8df885fe2e3986461aa63
Font color f3a4c98eff4f3c6be42a23567f866410The word you want to entere6e38b3c62e8df885fe2e3986461aa63
The font becomes bolda4b561c25d9afb9ac8dc4d70affff419The word you want to enter0d36329ec37a2cc24d42c7229b69747a
The font is italic5a8028ccc7a7e27417bff9f05adf5932The word you want to input72ac96585ae54b6ae11f849d2649d9e6
2. CSS Text attributes:
color : #999999; /*Text color*/font-family : 宋体,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-aligned* /text-align:left; /*Justify text to the left*/text-align:center; /*Align text to the center*/text-align:justify ; /*Text dispersed alignment*/vertical-align attributevertical-align:top; /*Vertical upward alignment*/vertical-align:bottom; / *Align vertically downwards*/vertical-align:middle; /*Align vertically center*/vertical-align:text-top; /*Align text vertically upwards*/vertical-align:text-bottom; /*Align text vertically downward*/
3. CSS symbol attributes:
list-style-type:none; /*No number*/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; /*Uppercase English letters*/list-style-type:disc; /*Solid circle symbol*/list-style-type:circle; /*Hollow circle symbol*/list-style-type:square; /*Solid square symbol*/list- style-image:url(/dot.gif); /*Picture 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; / *Do not repeat the arrangement*/background-repeat : repeat-x; /*Repeat the arrangement on the x-axis*/background-repeat : repeat-y; /*Repeat the arrangement on the y-axis */Specify the background position
background-position : 90% 90%; /*The position of the x and y axes of the background image*/ background-position : top; /*Align up*/background-position : buttom; /*Align down*/background-position : left; /*Align left*/ background-position : right; /*Align right*/background-position : center; /*Align center*/##五, CSS connection properties:
a /*All hyperlinks*/ a:link /*Hyperlink text format*/ a:visited /*Viewed link text format*/ a:active /*Format of pressed link*/ a:hover /*Mouse to link*/ Mouse cursor style: Link finger CURSOR: hand Cross body cursor:crosshair Arrow 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 Arrow points to the upper right cursor:ne-resize Arrow points to the upper left cursor:nw-resize Text I-type cursor:text Arrow tilts to the 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*/ 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 width of the top border*/ border-top-style : solid/*Set the top border style*/ Other border styles solid /*Solid border*/ 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: 8. CSS border style: padding-top:10px; /*Leave blank top border*/ padding-right:10px; /*Leave blank right border* / padding-bottom:10px; /*Leave the bottom border blank*/ padding-left:10px; /*Leave the left border blank*/
margin-top:10px; /*Top border*/margin-right:10px; /*Right border value*/margin-bottom:10px; /*Lower margin value*/margin-left:10px; /*Left margin value*/
##9 , CSS border blank:
Related tutorial recommendations:
The above is the detailed content of What types of css properties are there?. For more information, please follow other related articles on the PHP Chinese website!