Bad habits and problems of html development ., Html development habits
I recently read a lot of questions and bad habits in html development on the Internet. I would like to summarize them.
I. spacing between top and bottom
During development, you will find that the upper and lower spacing of the two p labels you set is 20 PX, but in actual measurement, you will find that there will be 4 more p labels ~ 8px. Why! If you are an old driver, I don't need to say much,
Because the amount in the design draft is the gap between words and words, in fact, if you write a p label to check the elements, the p table label will be left White, and there will probably be a 2 PX left and right margin of white. In this case, add your
The top or bottom margins are more points when you increase the volume.
<! DOCTYPE html>
<Html>
<Head>
<Meta charset = "UTF-8">
<Title> </title>
<Style type = "text/css">
*{
Margin: 0;
Padding: 0;
}
P: nth-child (1 ){
Margin-bottom: 20px;
}
</Style>
</Head>
<Body>
<P> p1 </p>
<P> p2 </p>
</Body>
</Html>
When you are measuring, we are measuring the bottom margin of 20 PX above;
Ps: If you have a [FQ tool], you may wish to download a Page Ruler in the Google browser mall. I personally think it is a very useful tool for measuring web pages.
It is found that the distance of 20 is successfully changed to 25, which is the white of the p tag.
Ii. Incorrect nesting
This kind of nesting when there is content in it, when a screen can not be viewed, the nesting error may be annoying. Is it the best solution? I still feel like commenting, a good habit of commenting, so that you can quickly find your own problems and facilitate the development of the team.
In this case, will you still find an error? It is more convenient when you modify it.
3. Who should write form and table first? Of course, this problem will only happen to new users?
Error:
<table><form><tr><td>..... </td></tr></form></table>
Correct:
<form><table><tr><td>..... </td></tr></table></form>
In my personal understanding, it is too awkward to write a form in a table. Because table is a complete format, we use from to wrap the table.
Iv. Omitting the img alt attribute
When your network speed is poor or the image cannot be displayed, this will help you. You can describe your image so that you can understand what it is without seeing it.
5. Use a large number of escape tags, such as & nbsp; & it; & gt ;..........
In each browser, for example, the default width of & nbsp is different. Therefore, when you use a large number of & nbsp; browsers, it changes. So now, this is a great way to use it.
Lo's escape tags are also useful, such as: & copy; copyrighted trademarks;
6. You prefer a browser. Because the browser kernel is different, it also supports different effects. When you prefer a browser, you will crash in other browsers.
Ps: Of course, except for IE, the earlier version is terrible. All these versions have resolutely resisted the earlier version of IE. Of course, this is my personal opinion, after all, there are still a few user groups that support low version Internet Explorer users.
For example, if a State-owned enterprise purchases windows with its own IE and the state-owned enterprise does not upgrade it after it buys it for security purposes. When it comes to outsourcing to a state-owned enterprise and entering the door without a mobile phone, you will understand.
7. Incorrect prompts.
When you prompt a user error, you say that the collected data will also be greatly deviated, for example, "Enter the address ", you need a home address! What about the current address! It's also the company address! Therefore, explicit prompts are very important.
8. The page contains too many refresh steps.
Use ajax partial refresh to reduce page duplication. Enhance user experience.