When laying out a web page, should you write HTML or CSS first?

Many friends have their own habits. Some people like to write CSS first, and some people like to write HTML first. So what is the most scientific writing process for web page layout? Today I will analyze it for everyone

There are many answers to this on the Internet: write HTML first and then write CSS; write CSS first and then write HTML; write both at the same time.

When I usually make HTML pages, I choose to do both at the same time. First, create a rough directory file for the website, such as imges: to store the page pictures; js: to store the JS script language, and I recommend placing the CSS file directly in the images folder, so as to avoid mistaking the image path when calling the image background, and to facilitate the maintenance of image names; naturally, the html page should be placed in the root directory.

Then we first write the most basic layout part in HTML, using DIV, and then directly add ID or CLASS (the difference between ID and CLASS) in the DIV. These layout parts include Jacket part, head part, middle part, left, center, right, copyright part etc. The head, middle, and bottom are basically the common parts of the page, and most web pages are grouped by these three parts. After we name these parts with ID or class, we write the corresponding css style attributes in the css style file. Before writing the css, we need to define the global div, h1, h2, font, font size, li and other styles of the entire site. I won’t go into details here. If you want to know more, please go to the global definition css template I use to learn more. Download and use it, so that you don’t have to redefine it every time you create a new website, but you can directly copy the common basic CSS style definition template and use it.

Generally when making DIV+CSS, it is best for novices to do html and CSS at the same time, so as to reduce errors. If the experience is not very good during the production, I hope to test the compatibility in a variety of different brand version browsers during the production process. Whether the display appears normal in this browser, but the display is incomplete and confusing in other browsers, etc. . In this way, we can solve and understand basic compatibility issues, accumulate valuable DIV+CSS technical experience, and get used to taking notes so as not to forget them in the future.

Let’s learn about writing HTML first and then writing CSS:
Why do some experienced people say to novices that we can’t write the HTML part in one go? Because people are likely to make mistakes, there may be problems in the process of writing your ideas, or due to browser compatibility issues, some of which you did not anticipate in advance due to lack of experience, so you discovered them when you were writing the style. If there is a problem, you may need to change your HTML code. If you write the HTML first and the page becomes larger, you may forget the CSS attribute layout selection you thought of in HTML.

Then let’s learn about writing CSS first and then writing html:
For experienced CSS producers, this is more feasible than writing html first and then css. why? We know that CSS's Inheritance parent attribute feature is quite good, so we can use this to write CSS first. But this cannot be the case for novices. If you write the CSS first and then return to the HTML page to write, you will look back at the CSS you wrote and forget how to call the selection. Since you have no experience in CSS compatibility issues, the compatibility is also quite good. Difference. Experienced people use the parent inheritance feature to layout the CSS file code, and when returning to HTML, it is clear that it is not easy to make mistakes when calling the class and ID in CSS.

Through the above introduction and explanation of the sequential writing methods, it is worth mentioning that generally when making pages, we usually use both at the same time + browser testing. It is very good to write both at the same time or half-first to write css and then write html, or the other way around, half to write html first and then write css. This way it is less likely to make mistakes and avoid wasting time on modifications after making mistakes.

The above statement may not be completely correct, but through the above I want to tell DIV+CSS production developers that it does not matter whether you write html or CSS first. What matters is your love for div+css. In daily practice, you can also perform HTML/CSS at the same time. It all depends on your habits. But as you develop and produce more, you will naturally come up with a method that suits you and develops quickly. Hope the above is helpful to you.

# I believe you have mastered the methods after reading these cases. For more exciting information, please pay attention to other related articles on the php Chinese website!

Related reading:

How to set the text font color of CSS

There is a difference between div and span in the HTML web page layout What's the difference

How to set the font text in css

The above is the detailed content of When laying out a web page, should you write HTML or CSS first?. For more information, please follow other related articles on the PHP Chinese website!