Beginners to see: Learning Web Technology CSS from where to start technology?

css| Beginners | Web page

Introduction:

Quote a passage from a book: "When I first started learning Chinese, my family teacher, Lao Wang, gave me a Chinese-English dictionary, a grammar book and a beginner's course." But he put the books in a book basket and said it would be useful next week. In the first week, he only taught me to listen and memorize some phrases. Before he began his rigorous and orderly study, he asked me to learn how to retell some of the essays. "Excuse me, where is the restaurant?" ”。 "Please give me some rice". "How much does this dress cost?" ”。 In that week, I had to accept knowledge, sentence structure, pronunciation and grammar unconditionally. By Friday, however, I could have gone to a Chinese restaurant and had a bowl of rice and paid paying. There is no theory, no explanation, and these simple phrases give me enough grammar and vocabulary to do this thing.

I don't know when to start, CSS began to pay attention to people. Many people are beginning to learn CSS, but do not know where to start, so this article is written for those beginners, take them to the CSS train.

A. CSS learning emphasis on the method!

Learning anything is the same, from primary school, middle School, university, in addition to learning knowledge is to learn methods!

To master the CSS, first of all to learn HTML, I just started from zero began to learn, spent one months to learn HTML, no teacher, the book is my only teacher, there is no internet conditions! After one months, I began to learn CSS, just started to see the first CSS book is "CSS page style design" after a few days to find out how to read! , then changed an "HTML Reference encyclopedia", this book is a Web maker's desk standing book! The reason to change this book to learn CSS is because there is a part of it is CSS, it became my CSS Enlightenment book. After reading a few paragraphs, feel that foreigners write the tutorial is very organized, from the deep, step-by-Step to guide you to go, so that you understand what they are saying, rather than as the domestic book to speak of different depths, lack of organized, as if afraid you do not know he is very learned! Like the previous book, "CSS page style design" at that time, for beginners css I, really do not know what it said!

To talk about the details of the learning process , because a style it is impossible to break out of the HTML page, HTML does not combine with the style, CSS lost the meaning of existence. So the general book will give an example, and then let you on the machine test effect, this is the author wants you to have a style sheet CSS has a preliminary impression, tell you what CSS can do. A small example: "Though small, spite", you may not be able to read the true meaning of each statement. But you can remember the example of the pattern, the practice of continuous use, and constantly use the process is to remember the process, so can not restore the heart, can not always think of their own memory is not good, but whether you ride is a cow or a winged steed, as long as perseverance, will certainly reach the end.

Reading a book, in general, the first time to read through the entire book, do not understand also to look down, in the process of looking down you may find the answer to the question. After reading you have a general impression, but there must be a lot of do not understand the place, it does not matter, continue to look down.

The second time you're going to look around and do your study notes, and write down the parts that you think are important. Also, you feel the part of the doubt to write down, with questions to see, if there is no answer, you can go to BBS to send a post, kind-hearted people or a lot of, hint A: "must learn how to ask questions!" " I won't say it here." You also have to go to the computer to practice the example in the book, the most confusing: "One can not remember, the other is the concept of the wrong understanding (this may be a bad translation of the book, the other is your understanding of the wrong)", for the first one you have to build confidence, adhere to go on. When you get to the finish line, you find that everything is logical. Because you work hard, there will be rewards and results.

A lot of people also read, but there is no progress, I analyze the main reasons for the following:

reason one: the pressure is not enough, because a lot of people like art to learn CSS, because it is to see others learn, so learn, do not learn no advantage! This kind of pressure is very small, not learn and art this bowl of rice.

reason two: just amateur study, this study is just a play, because you do not have to use this technology to eat.

reason three: the method is wrong, some people just look at the tutorial, but he does not do, I used to see too much, do too little, so have the practice you can put the theory of things to rub in.

Two. Mastering the four learning stages of CSS

Once I ask a netizen, learn css difficult? She said: "Not difficult" I said how long have you been studying? She said, "just learn." In fact, she is right! If someone asked me to learn CSS difficult? I would say: "Hard!" "Why would I say it hard?"
Learning CSS can be divided into the following stages:

Phase One : Do not think about the compatibility of the browser situation can make a page, but the page everywhere with a table of the pattern Div write the page.

Phase Two : Thinking about compatibility issues, but not early prevention, will only fix problems, a lot of use of hack technology (I only know the hack technology, but with very little)

Phase Three : Bugs can be prevented in advance, but the style sheet is heavily used id,class,css translation is overlapping style sheets, such as "DIV P SPAN". This code is to indicate the child element span of P in the div child element, so that you can define the span style without adding class to the span. This is the advantage of CSS, why not make good use of and must define a class it!

Phase Four : This phase is the hardest, good HTML semantic structure, reasonable CSS, reusable style. Good semantics has this article, the reasonable CSS, these two aspects will certainly write the topic to study.

Three. CSS Beginners FAQ:

Let's step forward. The first requirement is to have a caption directly below the thumbnail. The approach is quite straightforward: put a picture in your HTML, then a break line (BR), and place the title in a paragraph (P) and put it in (using CSS).

Then we're going to have these thumbnails align with the title in the browser window. When using tabular layout, the pair of thumbnails and headings are placed in the TD respectively. When using CSS typography, we're going to put them in a DIV, respectively. To allow them to be arranged horizontally on the window, we use CSS to float the DIV to the left (float).

problem 1 : Learn CSS What kind of book should I choose?

First recommend a few:

the CSS authoritative Guide "

"website Refactoring"

"website layout record"

the HTML Reference Encyclopedia "

If you don't know much about HTML, you can read theHTML Reference book, which is a teaching book and a good tool for querying HTML. " Recently published "proficient in CSS", "impeccable Web Design" are very good books, but not suitable for no CSS based on the people to read , to become an excellent css Builder, but also have a solid foundation in English, so you can go to read foreign CSS tutorials, participate in relevant forums, some people say, do not understand English can only look at the code, But in fact, their book is not only about the code, but more importantly, they will tell us the code of Thought and coding methods, which we are worth learning and understanding. In addition, I recommend the Chinese tutorial is:"HTML and CSS Standard", Sue Shen Xiao "CSS2 Chinese Manual" , electronic version of "Web Designer" , the English version of a lot of e-books, not a few examples. Reading E-books is a very boring thing, I am not accustomed to looking at the electronic version, so often buy books to see.

problem 2 : With what software to edit CSS Code ?

This question seems to have been asked the highest frequency! First of all, I started with Dreamweaver to write code, because the Dreamweaver software itself is a CPU and memory of the software, the speed of editing can be imagined. After walking for a long time, I was over to the " half handwriting " state, " half handwriting " is the use of the Code hints DW provides, when you write "F" when the "F" style will immediately prompt out in the back, convenient for you to choose. If you write a few more letters, the style you want will be quickly found, so that you can speed up your writing style, but there is a disadvantage is that if you break away from the editor of the hint, you will not write the style , such as when you are in the programmer to modify the fine-tuning style, He's not necessarily using the software you use, not necessarily code hints, so you can only go back to your own machine edit and then send to the programmer! It is obviously unprofessional to do so! So if you want to be a good person, you need to be professional enough!

It seems that the topic has not been mentioned:

as long as you can reach the level of handwriting, with any software can be recommended to use DreamWeaver Plug TopStyle (the latest version is Pro V3.12 ).

problem 3 : First Write HTML or write it first . CSS ?

There are many answers on the Web: write HTML before writing CSS, write css and write html; I tend to write them together, writing CSS or writing HTML first is not the right way for beginners. If you let a person write code, you tell him to write HTML first, after writing HTML can not be modified, and then you write CSS, if he can write, then this person must be a very high level of builder! So for beginners, most of the time I suggest writing simultaneously, specifically I say the steps:

1. First to build the site, the directory is built, such as we have a good folder Css,images, these two are the most of them, and then create a new HTML file, a style.css an empty style sheet, the HTML page to connect to this external style sheet.
2. Then we write the most basic part of the layout in HTML, all with Div, then add ID or class directly to the Div, which includes the coat part, the head part, the middle part, the left, the middle, the right, the copyright part and so on.
3. After you've written this, you can write the style in the stylesheet, or you'll write the part of the layout, we take the head as an example, write the logo part in the head, and the NAV part also adds ID or class. Other empathy.

Why is it that we can't write HTML parts at once, because people are likely to make mistakes, maybe your thoughts are written in a problematic way, or for browser compatibility issues, some of which you don't anticipate in advance due to lack of experience, So it's possible to change your HTML code when you're writing a style and you find a problem. Big to the writing is like this, you can also html/css at the same time, can be, see your habits. When we write code, we often write the code side of the test, not to say to write a test sentence, but to write a piece of code after the browser test, I was at the same time with IE6 and FF test. A good producer. Their code is written a lot when they are tested, because if a person has more experience, they will know and prevent the browser error display in advance! So they write code faster than people with no experience. They've gone through the mistakes you've been going through, and the first time you've encountered the wrong browser display problems you take time to fix, and they can be prevented or encountered in advance to solve the problem immediately! That's one of the different points you have with them.

Beginners and master different points there is a master of the use of a large number of shortcuts , so be sure to remember those commonly used shortcut keys, each small detail has a little improvement, integrated together is a great improvement.

In addition to improve their level the best way is more practice, find some better html+css template coding practice, the beginning to choose a simple point, the page screenshot, and then put this picture with their own ideas to revert to HTML page ...

Finally, I wish you all a good study and progress.