How to manage a good style _ experience Exchange

Learning Web standards of friends are generally from learning css to start, why? Because CSS is a very interesting language, it can make our pages ever-changing. Perhaps our first contact just because of the link style changes, and then slowly discover the powerful and simple CSS, so we use it to control the layout of the entire page, typesetting, color, pictures and so on work. After learning CSS, we will find that XHTML structure is more important, a good XHTML structure can make CSS much less cost. It also avoids the differences between pages in different browsers. I began to learn the XHTML code and constantly groped for the features of XHTML's structure. Will write CSS, but also understand the importance of XHTML structure and can be used flexibly, is not it possible. Maybe then we will find that the management of the style is also very important.

Everyone may have their own management, because the different types of Web pages to be applied may not be the same way of management, here I just put my style management to do a collation. is to provide you with a reference and research examples, to the lack of their own management methods to provide a reference model for friends.

My style management is for a single project, a single style of the Web site, generally such sites are small and medium-sized sites, style is consistent. For large sites, or the style of a very different Web site system is not applicable. We should first think about the maintainability of the style before we make the style. As soon as necessary to modify the need to quickly and easily, the cost of revising the work is very high, so we should try to avoid the expansion of the time that such work takes. Then it is necessary to separate the style from the structure code. Here's a look at my directory allocation method:

Among them, [images] is the image that is stored in XHTML, [Jonstyle] I call the theme package, in the style package includes [CSS], [img], [JS ] Store CSS style sheets, the pictures referenced in the style sheet, and the JS used in the Web page. The image is stored here [img] and the outside [images] Although the picture is stored, but the nature of the picture here is not the same. [img] is the image referenced in CSS, all of the images are related to the CSS style, his attribution is that [img] in the image is attributed to CSS, not XHTML. CSS is not referencing a picture in [images]. The images in [images] belong to xhtml,xhtml and do not use the images in [img] directly.

Here [JS] is also placed in the [Jonstyle] folder may be uncomfortable, my consideration is this: the behavior and style of this is to make this XHTML structure can be colorful. When we need to change the skin, there is also the need to change the behavior. For example: In the first scenario, the content of a chunk is scrolled up and down, but in the second scenario, the chunk needs to scroll left and right. Then this behavior also needs to be replaced with the sample workers. Of course, the actual application of the time is not necessarily such a simple reason.

Basically the big structure is this way. What about the structure of the style sheet? This is how I divide it: The style pack has a base.css (basic common Style) Module.css (module style) forms.css (form style) mend.css (patch style) print.css (print style)

Where Base.css is a basic style, that is, the common style of all Web pages, this style with MODULE.CSS can basically display the normal page. Forms can also be useful for the style management of forms in different places. Web standards involve compatibility, so there is a need to have a style patch of course there are also targeted here is not listed. The last print style is provided to the print settings for use.

I through this division, in the maintenance and site of the sample update, it is very easy, basically can not require the participation of the program personnel can complete the site of the skin replacement. If a site has many theme packages at the same time, you can use different styles as long as you simply change the name of the theme package in XHTML. This is in line with the website program will be able to make very good, very strong extensibility of the application site to!

The above content is said to be more limited, I hope to have a little help in the style management of everyone

