CSS style sheets

· UL labels have padding values by default in Mozilla, while only margin has values in IE.

· The same class selector can be repeated in a document, but the ID selector can only appear once. CSS is used to define a tag using both Class and ID, if the definition is repeated, the definition of the ID selector is valid.

· A beginner may encounter this situation. It is normal to set the attribute of the same tag to a in IE, and B in Mozilla must be set to display normally, or two.
Temporary solution: select the character {property name: B! Important; attribute name: A;} // IE7 is invalid

· If some spacing is required between a group of labels to be nested, leave it to the margin attribute of the label located inside, instead of defining the padding of the label located outside.

· We recommend that you use background-image instead of list-style-image as the icon before the Li label.

· Ie cannot tell the differences between the inheritance relationship and the parent-child relationship. All are inheritance relationships.

· When giving your tags crazy selector, don't forget to add comments to the selector in CSS. When you modify your CSS later, you will know why.

· If you set a deep background image and a bright text effect for a label. We recommend that you set a deep background color for your tag at this time.

· Pay attention to the order of the four states of the link: link visited hover active

· Use background for images unrelated to content

· The definition color can be abbreviated as # 8899ff = # 89f

· Table performs better in some aspects than other labels. Use it where column alignment is required.

· <SCRIPT> the language attribute does not exist. It should be written as follows: <SCRIPT type = "text/JavaScript">

· The title is the title, and the text of the title is the text of the title. Sometimes the title does not need to display text, so:

· Perfect single-pixel outer box line table (which can be tested in ie5.0 ie6.0 and FF, but not in other tests) Table {border-collapse: collapse;} TD {border: #000 solid 1px ;}

· The negative value of margin can be used for relative positioning when the label is absolutely positioned. When the page is centered, the left: xxpx attribute is not suitable for the layer with absolute positioning. Place this layer next to a tag to be located, and then use the negative value of margin as a good method.

· When absolute positioning is performed, you can use the margin value to locate the position relative to the position of the window. This is different from the top, left, and other attributes. The advantage of absolute positioning is that it allows other elements to ignore its existence.

Several common CSS styles

· 1. Align the two ends of the text: Text-align: justify; text-justify: Inter-ideograph;

· 2. fixed width Chinese Character truncation: overflow: hidden; text-overflow: ellipsis; white-space: nowrap .) (Ie5 or above)

· 3. Fixed-width Chinese character (Word) lines: Table-layout: fixed; Word-break: Break-all; (ie5 or above)

· 4. <acronym style = "cursor: Help" Title = "Enter the text to be prompted"> text </acronym> move the cursor over the text to see the effect. This effect can be seen on many foreign websites, with few in China.

· 5. The image is set to translucent:. halfalpha {background-color: #000000; filter: alpha (opacity = 50)}. The image is tested in IE6 and ie5, and FF fails.

· 6. Flash transparency: Select SWF and open the originalCodeWindow, enter <Param name = "wmode" value = "Transparent"> we often use to place the mouse on the image before making a webpage, and the image turns on, you can use the image replacement technique or the following filter. The Code is as follows:

. Pictures IMG {filter: alpha (opacity = 45 );}
. Pictures A: hover IMG {filter: alpha (opacity = 90 );}

· If the text is too long, the excessive text will be displayed as ellipsis: ie5 and FF are invalid, but can be hidden. IE6 is valid.
<Div style = "width: 120px; Height: 50px; Border: 1px solid blue; overflow: hidden; text-overflow: ellipsis">
<Nobr> for example, a row of text is long and cannot be displayed in a table. </nobr>

· Replace the comments with the following comments: <! -- [If! IE]>
Put your commentary in here...
<! [Endif] -->

· How to Use CSS to call the external font Syntax: @ font-face {font-family: Name; SRC: URL (URL); srules}; Value:
Name: font Name. Value of any possible font-family attribute
URL (URL): Specifies the opentype font file with an absolute or relative URL address
srules: style sheet definition