Properties common in CSS-----on the road (14)

First, CSS text properties

Color:#999999;/* Text color */Font-family: Song Body,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 characters */line-height:200%;/* Set Line Height */Font-weight: bold;/* Text Bold */Vertical-align: Sub;/* Subscript word */Vertical-align: Super;/* Superscript word */Text-decoration: Line-through;/* Add Strikethrough */Text-decoration:overline;/* Add top Line */Text-decoration: underline;/* Underline */Text-decoration: none;/* Delete Link underline */Text-transform:Capitalize;/* First Letter Capital */Text-transform:Uppercase;/* English Capital */Text-transform:lowercase;/* English lowercase */Text-align: Right;/* Text Right-aligned */Text-align: Left;/* Text left aligned */Text-align: Center;/* text Center align */text-align :justify; /* text dispersion alignment */vertical-align properties vertical-align:top; /* vertical upward alignment */vertical-align :bottom; /* vertical downward alignment */vertical-align :middle; /* Vertical center alignment */vertical-align :text-top; /* text vertically upward align */vertical-align :text-bottom; /* text vertical down */           

Second, CSS border blank

padding-top:10px; /*上边框留空白*/padding-right:10px; /*右边框留空白*/padding-bottom:10px; /*下边框留空白*/padding-left:10px; /*左边框留空白

Third, CSS symbol properties

List-style-type:none;/* Not numbered */List-style-type:decimal;/* Arabic numerals */List-style-type:lower-roman;/* lowercase roman numerals */list-style-type:upper-roman; /* Capital Roman numerals */LIST-STYLE-TYPE:LOWER-ALPHA; /* lowercase english letter */LIST-STYLE-TYPE:UPPER-ALPHA; /* capital English letter */LIST-STYLE-TYPE:DISC; /* solid circle 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 */            

Four, CSS background style

background-color:#F5E2EC; /*背景颜色*/  background:transparent; /*透视背景*/background-image : url(/image/bg.gif); /*背景图片*/background-attachment : fixed; /*浮水印固定背景*/background-repeat : repeat; /*重复排列-网页默认*/background-repeat : no-repeat; /*不重复排列*/background-repeat : repeat-x; /*在x轴重复排列*/background-repeat : repeat-y; /*在y轴重复排列*/

background：liner-gradient（ to 方向.初始颜色.渐变颜色）；/背景颜色渐变；/

Background positioning:

background-position : 水平方向 垂直方向; /*背景图片x与y轴的位置*/background-position : top; /*向上对齐*/background-position : buttom; /*向下对齐*/background-position : left; /*向左对齐*/background-position : right; /*向右对齐*/background-position : center; /*居中对齐*/
background-attachment：fixed；/背景图片固定定位/

V. CSS link Style

specification Steps tips: I love I heat
A/* All Hyperlinks */A: Link/* Not visited */A: Visited/* browsed */A: Active/* The current mouse is pressing */A: hover/* Mouse hover */mouse cursor style: Link fingerCURSOR:Hand 10 fontsCursor: Crosshair arrow facing downCursor: S-resize Cross ArrowCursor: Move arrow facing rightCursor: Move plus a question markCursor: Help Arrow facing leftCursor:w-resize arrow facing up cursor:n-resize Arrow toward right cursor: Ne-resize arrow facing left cursor:nw-resize text i type cursor:text Arrow oblique right cursor:se-resize Arrow Oblique Left cursor:sw-resize funnel cursor:wait cursor pattern ( ie6) p {cursor:url (" cursor filename. cur "), text;}               

VI. CSS BOX model

#6699cc; /_上框线_/
border-bottom : 1px solid #6699cc; /_下框线_/
border-left : 1px solid #6699cc; /_左框线_/  border-right : 1px solid #6699cc; /_右框线_/
以上是建议书写方式,但也可以使用常规的方式 如下:
border-top-color : #369 /_设置上框线top颜色_/
border-top-width :1px /_设置上框线top宽度_/
border-top-style : solid/_设置上框线top样式_/
其他框线样式solid /_实线框_/
dotted /_虚线框_/
double /_双线框_/
groove /_立体内凸框_/
ridge /_立体浮雕框_/
inset /_凹框_/
outset /_凸框_/
注：有些css3 中的border新属性已在css3相关知识整理

Vii. Application of Css--form form

文字方块  按钮  复选框  选择钮  多行文字方块  下拉式菜单 选项1选项2
注：有关form表单已经单独整理，请参考博客form表单有关知识

Eight, CSS boundary style

margin-top:10px; /_上边界_/
margin-right:10px; /_右边界值_/
margin-bottom:10px; /_下边界值_/
margin-left:10px; /_左边界值_/

Ix. CSS Filter Properties

Filter: Add a filter effect to the style. Because this property is more informative, we'll go to the next chapter to introduce the filters separately. 1.Alpha: Set Transparency Alpha (opacity=, finishopacity=, style=?, startx=?, starty=?, finishx=?, finishy=?) Opacity: Transparency level, range is 0-100, 0 is fully transparent, and 100 is completely opaque. Finishopacity: When you set the transparency effect of a gradient, you specify the transparency at the end, ranging from 0 to 100. Style: Sets the style of the gradient transparency, with a value of 0 for the uniform shape, 1 for the line, 2 for the radial, and 3 for the rectangle. StartX and Starty: Represents the start x and y coordinates of the gradient transparency effect. Finishx and Finishy: represents the coordinates of the gradient transparency effect ending with x and Y. 2.BlendTrans: Fade-in and fade-out effects between images Blendtrans (duration=?) Duration: Time to fade in or fade out. Note: This filter must be combined with JS to create a sequence of images to make the effect between pictures. 3.BLRU: Create Blur effect Blur (add=, direction=?, strength=?) ADD: Whether single direction blur, this parameter is a Boolean value, True (not 0) or False (0). Direction: Sets the direction of the blur, where 0 degrees represents a vertical upward and then every 45 degrees is a unit. Strength: Represents the blurred pixel value. 4.Chroma: Set the specified color to transparent Chroma (color=?) Color: Refers to the colors to be set to transparent. 5.DropShadow: Create Shadow Effect DropShadow (color=, offx=?, offy=?, positive=?) Color: Specifies the colors of the shadow. OFFX: Specifies that the shadow is offset in the horizontal direction relative to the element, Integer. Offy: Specifies that the shadow is offset in the vertical direction relative to the element, Integer. Positive: Is a Boolean value that is true (not 0) when it is represented as an established vulva shadow; False (0), which is expressed as an inner shadow. 6.FlipH: Reverses the element horizontally by 7.FlipV: inverts the element vertically 8.Glow: Creates an outer glow effect Glow (color=, strength=?) Color: is the colour that specifies the glow. Strength: The intensity of light, which can be any integer between 1 and 255, the larger the number, the greater the luminous range. 9.Gray: Remove the color of the image and display it as a black and white figureLike  Invert: Invert the color of the image to produce a film-like effectLight: The effect of placing lights, which can be used to simulate the projection effect of light sources on objects Note: This effect requires JS to set the position and intensity of the light.Mask: Create a transparent mask mask (color=?) Color: Sets the background to allow the object to cover the part of the background with transparency.Revealtrans: Create a toggle Effect Revealtrans (duration=, transition=?) Duration: Is the switching time, in seconds. Transtition: Is the switch mode, can be set from 0 to 23. Note: If you do a switch between pages, you can<Head> area plus one line of code:<meta http-equiv= page-enter content=revealTrans ( Transition=?,duration= >. If the elements used in the page must be used in conjunction with JS. 14. Shadow: Create another Shadow effect Shadow (color=?, direction=?) Color: Refers to the colour of the shadow. Direction: is the direction in which the projection is set, 0 degrees represents the vertical upward, and then every 45 degrees is one unit. 15. Wave: Ripple effect Wave (add=?, freq=?, lightstrength=?, phase=?, strength=?) ADD: Indicates whether the original object is displayed, 0 is not displayed, and not 0 indicates that the original object is to be displayed. Freq: Sets the number of fluctuations. Lightstrength: Sets the light intensity of the wave effect from 0 to 100. 0 represents the weakest and 100 is the strongest. Phase: The starting phase angle of the wave. A percentage value from 0 to 100. (For example: 25 equals 90 degrees, and 50 equals 180 degrees.) ) Strength: Sets the amplitude of the wave swing. 16. Xray: Shows the outline of the picture, X-ray effect 
 
 
    Some knowledge covers a wide range of knowledge points complex, so some knowledge has been taken out to share, can be in my blog home search you want to know the relevant knowledge of the keyword    
 
 
   

Properties common in CSS-----on the road