Simple and easy to understand, DIV+CSS architecture website of 7 layout forms, gave away

Here are the 7 kinds of layouts that I have compiled for you DIV+CSS architecture website, interested students can go to see.

1. "T" Structure layout form. The so-called "T" structure, that is, the top of the page is a horizontal bar site logo + advertising bar, the bottom left to the main menu, the right side of the layout of the content, the overall effect is similar to the English letter "T", so called "T, Shape layout. This is one of the most widely used layout methods in Web design. The advantages of this layout is that the page structure is clear, primary and secondary clear, is the easiest way for beginners to get started layout method. The disadvantage is the rigid rules, if you do not pay attention to the details of color, it is easy to let people "look tasteless"

2. "Mouth" type layout. This is a pictographic statement, that is, the page is generally up and down there is a banner, the left is the main menu, the right to put links, etc., the middle is the main content. The advantage of this layout is to make full use of the layout, the information is large. The disadvantage is that the page is crowded, not flexible

3. Symmetrical contrast layout. As the name implies, take the left and right or upper and lower symmetrical layout, half dark half-light, generally used for design sites. The advantage is that the visual impact is strong, the disadvantage is that it is difficult to combine the two parts organically.

4.POP layout. Pop from advertising terminology refers to the page layout like a poster, with a beautiful picture as the design center of the page. Commonly used in the fashion category site. The advantages are obvious: attractive. The disadvantage is slow speed. As a layout, it is worth learning from.

5. State-type layout. The country layout is also called the same layout, which is the type of layout that some large websites prefer to use. The top is the title of the site and banner ads, followed by the main site of the website, left and right to break down some small pieces of content, the main part of the question, with the left and right to list the end, the bottom is the site of some basic information, contact, copyright notice. This layout is often used for home page design, the main advantage is that the page accommodates a lot of content, the information is large.

6. Title Body type layout. The top of this layout is the title or the ad, and the following is the text. Usually the article page or the registration page uses this kind of layout, its characteristic is concise crisp, the disturbance information is few, is more formal.

The above is I arrange for everyone, hope in the future will be helpful to everyone.

Related articles:

A detailed explanation of the position positioning of the page layout

Detailed introduction to CSS page layout tips

Explain the basics of CSS in detail.