A CSS tutorial to help you understand CSS

Body{color: #666666; font:12px Arial, "Song Body";} /* This defines the size, font, and color of the font that is common to the entire page; */
A:link,a:visited{color: #666666; text-decoration:none;} /* Defines the styles of all links (i.e. a tags) that are usually and accessed once in the next two cases, changing colors and removing underscores */
A:hover{color: #ff0000;} /* Defines the style of all linked mouse passes, font color change */
/* Head Area */
. header {margin:0 auto; Width:1003px;background:url (http://pigimg.zhongso.com/space/gallery/%E4%BC%81%E4%B8%9A%E5 %bd%a2% e8%b1%a1%e5%ae%a3%e4%bc%a0%e5%9e%8b/header.jpg) Repeat; Position:relative;} /* This style links a picture, and repeats within the set width and height, margiin:0 Atuo is centered relative to the outer layer */
. logo {float:left; position:relative; left:20px; Top:5px;display:none}/*logo picture position, floating to the left, relative positioning, and hidden, invisible Oh. */
. search {float:right;position:relative; right:0px; top:6px;} /* and the top layer of the logo side, because he floats like the right */
. search input{margin-right:5px; height:16px; width:183px; background: #ffffff; border:1px #dbe0e6 solid}/* The style of a text box, White background, with edge, 5 pixels from right */
. ssbtn{float:left; Width:38px;height:20px;background:url (http://i0.zhongso.com/skin/company/appearance/ search.gif) No-repeat Center;} /* Search button, nothing special */
. ssmore{float:left; width:38px;height:20px; Background:url (http://i0.zhongso.com/skin/company/appearance/ more.gif) no-repeat center;margin:0px 5px;} /* More buttons, nothing special */
. nav{float:right; position:relative; right:5px; top:10px; text-align:right;} /* Top right text, also used relative positioning, inside the font right */
. titblo {position:relative;left:100px;top:60px; margin-bottom:100px; width:400px;}/* page name and URL area location, or relative positioning, do not know why this is used, 100px*/from Bottom
. name{font:bold 30px/30px "blackbody"; border:0; background:transparent;text-align:right; Width:20em;filter:shadow (color=# ffffff,direction=120,strength=3);} /* Here is a bit of flower head, with a background image follow the mouse, but also with the filter, looks like shadow, ie specific properties, do not recommend you use */
. url{background:transparent;width:480px;padding:3px; color: #000000; visibility:hidden}/* page URL, use hidden, this hidden invisible, but occupy space */
/* Label Area */
. tags {padding:0 10px 0 6px; WIDTH:987PX;TEXT-ALIGN:CENTER;MARGIN:2PX Auto; Background:url (Http://i0.zhongso.com/skin/company/appearance/tag.gif) repeat-x;} /* Remember that the order of padding is upper right bottom left */
. tags li{float:left; display:block; cursor:pointer;/* Mouse Shape */margin:0 3px;height:22px;white-space:nowrap/* This seems to force a line of text to display */;}
. tag{padding-top:10px;} /* Non-current page label status */
. Tag A:link,.tag a:visited{color: #ffffff, Text-decoration:none; font-weight:bold;}/*tag link style, only useful for links within tags */