真人街机捕鱼

Your Position: Home > News > Changde Website Construction

Analysis of the common techniques of refactoring CSS in website construction of Changde Website

Date: 2015-10-23 15:19:52 Popularity: Tags: Website Construction
share to:

Many Changde website construction experts know the use of css abbreviations, because using abbreviations can help reduce the size of your CSS files and make it easier to read. Here is a summary of some css common tips to lay the foundation for website reconstruction.

1. Block and inline element comparison <br /> All HTML elements belong to one of block and inline.
The characteristics of the block element are:
Always preliminary on a new line;
Height, row height and top and bottom margins can be controlled;
The width defaults to 100% of its container, unless a degree sum is set to the block element.
In contrast, the characteristics of the inline element are:
And other elements on one line;
Height, row height and top and bottom margins cannot be changed;
The width is the width of its text or picture and cannot be changed.
, And are an analogy of the inline element.
You can use the display: inline or display: block command to change this feature of an element. When do you need to change this feature?
Let an inline element start from a new line;
Keep block elements and other elements on one line;
Controls the width of inline elements (especially useful for navigation bars);
Control the height of inline elements;

You do not need to set the width to set the background color of a block element with the same width as the text.

2. One more box hacking method <br /> The reason why there are so many box hacking methods is that IE's understanding of the box before 6 is different from others, and its width must include the width of the border and the space. To make IE5 and other browsers stick together, you can use the CSS method:
padding: 2em;
border: 1em solid green;
width: 20em;
width / ** /: / ** / 14em;

The first width is recognized by all browsers, but IE5.x does not recognize the width setting of the second line. Only because there is a blank comment symbol on that line (how stupid parsing!), IE5.x uses 20 min Drop some white space, and other browsers will use the width of 14, because it is the second line, it will cover the first line.

3. Minimum page width
min-width is a very convenient CSS instruction. It can specify that the minimum size of an element cannot be less than a certain width, so that the typography is always accurate. But IE does not recognize this, and it actually uses width as the minimum width. In order to make this directive work in IE, you can put one under the tag and specify a class for the div:
Then CSS planned like this:
#container
{
min-width: 600px;
width: expression (document.body.clientWidth <600? "600px": "auto");
}
The first min-width is normal; but the width of the second line uses Javascript, which is only recognized by IE, which will also make your HTML document less standard. It actually completes the minimum width through Javascript's decision.
The same method can also complete the maximum width for IE:
#container
{
min-width: 600px;
max-width: 1200px;
width: expression (document.body.clientWidth <600? "600px": document.body.clientWidth> 1200? "1200px": "auto";

}

4. IE and Width and Height Questions

IE doesn't recognize min-this definition, but in fact it treats normal width and height as the condition with min. This question is a big problem. Assuming that only the width and height are used, these two values will not change in normal browsers. Assuming that only the min-width and min-height are used, the width and height are not set under IE.

5. Different Cases <br /> When using CSS in XHTML, the element names defined in CSS are different case. In order to prevent this fault, I advocate that all definitions and titles should be lowercase.

Class and id values are also case-sensitive in HTML and XHTML. If you must mix case, please carefully acknowledge that your definition of CSS and tags in XHTML are together.

6. Revoke element constraints before class and id <br /> When you write to an element to define class or id, you can omit the previous element constraint, because ID is the only one in a page, clas s can be in Repeatedly used on the page. It doesn't make sense to constrain an element.
0
0
0
0
0
0
0
0
Name
Verification Code
Can't see clearly, change another Already Comment information, click to view comments
Comments from users