Technical work on fingertips: Rookie Html+css North

Intermediary transaction http://www.aliyun.com/zixun/aggregation/6858.html ">seo diagnose Taobao guest cloud host technology Hall

Now the market is full of various guide tutorials, in order to show the different of this series of articles, I deliberately named the North series, different where? I will teach you step-by-step learning by following a concept of HTML, and make sure you have a harvest after reading it.

Suitable for reading: there is not much spare money for the training institutions that the SB teacher, if you really want to go to the training institutions to learn, please inquire about the teacher's salary there, if there is no more than six thousand or seven thousand, then do not go, you do not think, you even with him to learn to die your wages will not exceed six thousand or seven thousand Yuan.

Before you learn, remember the great philosopher and martial artist Bruce Lee's remark: empty your cup before you can fill it. Empty to perfection.

Recommended reference book: 1,o ' Reilly. HeadFirst.Html.With.Css.And.Xhtml

2,W3C Shcool

3,css Zen Garden

4,html Document CSS Document

I think if you want to get started, the top three books are enough, it's a waste of money to buy other books, you might as well look at HTML document, and CSS document.

Episode 1th Understanding HTML and CSS

Goal: Through this lesson, you have to do: know what HTML is doing, the role of CSS.

OK, start class, borrow the Observer mode in software engineering, I assume that any look at this article must be to the web development, if not yearning for this development look at this article I think the brain must be in the water. OK, that's the first big thing to know about the concept of the Web.

The web Baidu explanation is as follows: The webpage is the basic element which forms the website, is carries each kind of website application the platform. In layman's parlance, your site is made up of web pages.

Also understand the concept of the browser:

Browser: The client browsing program for the World Wide Web (web) service. You can send various requests to the World Wide Web server and interpret, display, and play the hypertext information and various multimedia data formats that are sent from the server.

You can understand this: the Web mainly by the client and server-side components, the client is the terminal to receive information, similar to the time we send text messages, the client is the addressee, the server is the sender. Of course, abstractions omit firewalls, DNS, and the like, because you don't need to know anything about them.

So, you sometimes listen to some nerds say that the Web architecture is b/s architecture, if you know a little English, it is (Brower,and server) abbreviation, no meaning.

Of course, the above things are all nonsense, you do not understand do not need to see, learning HTML and CSS, in fact, to understand very few things.

Close your eyes, think about it, for example, you want to surf the internet today to see beautiful pictures, what do you do? OK, sure to open a browser bar, whether it is IE or Firefox, so you will naturally know that we have to use the browser to see the Web site, with professional words can be said that the browser is responsible for the HTML CSS JS to the client's end of the language in accordance with the built-in set of rules to parse into what we can understand the content of a tool.

As long as you understand the browser's parsing rules, is equivalent to say you read the basic HTML and CSS code, OK, now we look at how the browser is resolved. First, start with a classic Hello example.

Recommended editors: Notepad++,editplus,dreamware (Novice is not recommended, these IDE integration tools will destroy you, so that you will not write a complete line of code in a lifetime),

OK, save the example above as an. html, or. htm file, browse with a browser.

With the above example you will learn the following:

1, the label is generally in pairs appear, there is not a pair of labels? Of course, such as <input type= "image"/> But a single label in the end to add a slash, meaning I have closed.

2,html is made up of two parts,<head><body> they are wrapped in the outermost <html> HTML world, there is something (always remember that HTML is responsible only for Web content), Basically, as long as it's a content thing, he is either head, or belong to the body, if you later see something can be placed in the mind, and can be placed in the body, I can say to you, the code is not responsible for the content of things, they are either responsible for the style, Be responsible for some dynamic things and nothing else.

Because, in the client, the size is divided into three kinds of things:

HTML: Responsible for content

CSS: Responsible for styles

JavaScript: Responsible for dynamic things

As an example, you will understand:

Tycoon's virtual community has recently sprung up in real estate: He wants to build a big house like Mrs. Money (Baidu you know, home in the West refers to the villa), he wants to build a five-room three-hall four-David houses, to have a big garden, a parking garage, In his room he will buy some home appliances some furniture, please some servants.

In this, the virtual community of the park, garden, horizontal as a separate thing (these in the web is called HTML element inadvertently). So, he spent some gold coins to buy these props, but after buying, in their own empty space how to put, there must be a set of rules: it is possible that the rules to write:

1, south of two main horizontal

2, the garage is finally with the basement.

3, how to set the size of each prop

4, how to set the spacing of each prop

(these are called CSS styles)

Then the home appliance and the servant that the Carlsberg buys must also according to own heart request to choose, may be this:

1, the home appliance must have the X-max effect

2, preferably a complete set of smart home solutions

3, the maid not only will make fish fragrant shredded pork, also must cook instant noodles.

This article source: Himalaya net (http://www.ximalaya.com/) reprint, please indicate the source, thank you!