Web front-end development questions (not to be continued)

One, the difference between HTML and XHTML: 1) XHTML elements must be properly nested

2) The element must be closed such as: Close

3) Label name must be in lowercase letters

4) The XHTML document must have a root element

Second, the box model: The CSS box model specifies the way the element frame handles element content, padding, borders, and margins, commonly known as box models.

Three, multi-column layout is divided into: the Holy Grail layout and the double-winged layout

Two-wing layout (common) and the same points and different points of the Grail layout:

Same point: 1) middle column top (first load)

2) float each part (float)

3) Left: margin-left:-100%

Right: Margin-left: The width of the negative right column is as wide as the right column is 200px, then the Margin-left value is -200px

Different points: Solve the middle column is not obscured the idea of not the same

1. The Grail layout is to make room by padding way, then position:relative by relative positioning; Push it to both sides.

2. The double-wing layout is created by creating a sub-div, where the margin-left and Margin-right are set aside in the middle column.

attached: 1, the Holy Grail layout: Multi-column layout variants, sidebar width, the subject within a certain range of adaptive, and priority loading

Implementation ideas: 1) Set the padding of the main container div (left, right) and overflow (hidden) based on the sidebar position.

2) in the main container, add the body first, and then add a sidebar.

3) Set the body width to 100% (can accommodate changes in browser window size),

Float is left (prepares for sidebar positioning).

4) Set sidebar, position use relative, left column to set Margin-left to 100% to move to the front of the body

As well as the left property, the right column sets the margin-left to the negative right-hand column, and the Rights property.

Web front-end development questions (not to be continued)