Shulou(Shulou.com)06/02 Report--

Today, I will talk to you about what are the eight simple and practical skills in CSS page layout, which may not be well understood by many people. in order to make you understand better, the editor has summarized the following content for you. I hope you can get something according to this article.

And you focus on learning CSS page layout is very useful eight skills, such as when using the floating function to remember to properly clear the command, floating is a dangerous function, may not produce the desired results. If you encounter a border where a floating element extends to the outer container or other irregularities, make sure you are doing the right thing.

Eight useful techniques for CSS page layout

CSS page layout is difficult to say, but it is actually very simple. It is easy to say, there are often a lot of problems troubling beginners, in the 51cto.com introduced a lot of skills, these tips and knowledge can help you with twice the result with half the effort. However, more often, we are often haunted by some small problems. Today, I would like to introduce to you eight techniques, which are very useful.

First, if in doubt, test immediately.

A lot of headaches can be saved if you can simply detect the original code when something goes wrong. The W3C has detection tools available for both XHTML and CSS, see http://validator.w3.org. Please note that errors at the beginning of the file may cause more errors due to improper structure and other factors; we recommend that you correct some of the most obvious errors and then re-detect them, which may reduce the number of errors.

Remember to clear the instruction properly when using the CSS floating function

Floating is a dangerous feature that may not produce the results you expect. If you encounter a border where a floating element extends to the outer container or other irregularities, make sure you are doing the right thing.

Third, use padding or border to avoid boundary coincidence

You may be obsessed with space that should not be present at all, or you may not be able to squeeze out when you need a little space. If you use margin, it's easy to have boundary coincident.

Fourth, try to avoid specifying both CSS padding/border and height or width for the element

IE for Windows often leads to computational problems with width and height. There are some ways to solve this problem, but if the parent element needs to specify the height and width, * * can apply margin to the child elements within the parent element, or padding to the parent element when the child element needs to specify the height and width.

Don't rely on min-width/min-height

IE for Windows does not support two grammars. But to some extent, IE for windows can achieve the same effect as min-width/min-height, so as long as you do some filtering on IE, you can achieve the results you want.

If in doubt, reduce the percentage first

Sometimes some errors will make 50% 50% become 100.1%, causing problems with the web page. At this point, try changing these values to 49% or even 49.9%.

Remember how to write "TRBL"

The abbreviated syntax of border,margin and padding has a specific order, starting from the top and turning clockwise: top,right,bottom,left. So the result of the margin:01px3px5px; is borderless at the top, 1 pixel on the right, and so on. Remember "TRBL" and you won't get it wrong.

As long as the value is not zero, specify the unit.

This requires special attention, and many novice friends often ignore this problem. 51cto.com has more than one emphasis on this issue.

After reading the above, do you have any further understanding of the eight simple and practical techniques in CSS page layout? If you want to know more knowledge or related content, please follow the industry information channel, thank you for your support.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.