How can I easily explain the relationship between jQuery, CSS3 and HTML5 to beginners? -

Source: Internet
Author: User
0 reply content:
  • HTML is a skeleton composed of multiple bones (TAGS.
  • HTML5 is more new bones (labels), while removing bones that were previously hard to use.
  • CSS is the skin. CSS3 is a more beautiful skin
  • JS controls a single action. (Raise your hand, open your mouth, put down your hand, raise your leg, turn your head, and hold your fist)
  • JQuery orchestrates a group of common actions into a trick.
(For example, there is an orchestration in the action of eating: Pick up the spoon, dig a spoonful of rice, put the spoon close to the mouth, open the mouth, spoon into the mouth, spoon out the mouth, chew .)



----- Bytes --------------------------------------------------------------------------------------------------------------------------

After learning JS,

If you want JQuery What is the difference with JS ?, JQuery Can I replace JavaScript? Tell him this again. .
It is more convenient to use jQuery to communicate with computers. However, jQuery is a combination of a single action (JS,
So it is never possible to replace a single action (JS)

JQuery orchestrates many common actions (such as running, eating, jumping, and squatting ).
However, if you need some difficult actions (for example, face-to-ground), there is no Orchestration in jQuery.
Then you need to combine one with a single action (JS. The whole process is a process of assembling a robot.

HTML is the bracket, skeleton, and joint of the robot.

CSS is the external painting of this robot. What color? theme (fluorescent white diamond red )?

Javascript controls the behavior of this robot and allows him to open his arm and run.

HTML5 is a new type of material. It is more durable, simpler, clearer, and provides some new calling behavior (js api) for example, you can obtain the robot coordinates and automatically cache the data plotting function.

CSS3 is a simplified version with lighter paint and faster rendering.

Jquery is a JS-encapsulated library that controls behavior. With such commands, you can write the content that controls robot behavior more quickly. With such commands, developers can save time and improve efficiency, but there is no native action (JS) he can't do anything.

Your website or web APP is the assembled robot. If you are using the advanced HTML5 and CSS3 finished robot, there is a tragedy that only in the advanced combat environment can all play a role (http://caniuse.com)/ ) In a low-level environment (such as Internet Explorer 6), your robot is a waste of iron. The webpage we see is composed of three parts: html, js, and css. You can see all the puppet shows. We can use the analogy of the puppet show. Html is the structure of a webpage, similar to the skeleton of a puppet, or a bald puppet. Css is a webpage style. You can think of it as a puppet dress. For the same puppet, wearing different clothes will have different appearances. Similarly, for the same html, different css will display different styles. Js controls interaction. You can use js to operate on Webpage interaction (such as clicking a pop-up window). You can think of it as a line to control the puppet and let the puppet do various actions.
The following is the subject's question: jQuery, css3, and html5. You can use jQuery as a js type. css 3 is the new generation of css, and html5 is the new generation of html.
In this way, I should be able to understand it for beginners ......
Of course, the above metaphor is inappropriate. But it should be enough for beginners. The most important thing for beginners is not to get stuck in a specific detail, but to have an overall impression on what they want to learn and build a general framework. Therefore, JavaScript, html, and css have a general idea of the relationship between them. As for specific functions, you can understand what you learn ~ What is HTML and CSS?
HyperText Markup Language (HTML) is a Markup Language designed for "web page creation and other information that can be seen in Web browsers. HTML is used for structured information, such as titles, paragraphs, and lists. It can also be used to describe the appearance and semantics of a document to a certain extent. Created by Tim berneas-Lee in 1982 and further developed HTML by IETF using the simplified SGML (standard General Markup Language) syntax, it became an international standard and developed by the W3C) maintenance.
Cascading Style Sheets (CSS), also known as the string Style list, are defined and maintained by W3C, A computer language used to add styles (fonts, spacing, colors, etc.) to structured documents (such as HTML documents or XML applications. The latest version is CSS2.1, which is the W3C candidate Recommendation Standard. CSS3 is now supported by most modern browsers, and the next version of CSS4 is still under development.
The above section references And CSS I explained to you what HTML and CSS are, but if you have never touched them, continue.
Where have you seen HTML and CSS?
In fact, almost anyone who has used computers has experienced HTML and CSS, but we may not know it. Let's look at the following scenarios:

  • Hu's QQ received a news message saying that XX artist had an OO affair, which was right for Hu's appetite. So he clicked the message window and then the IE browser automatically popped up (yes, hu's computer is still the default configuration of XP), and then A Web page A is displayed.

  • Liu Ge liked caifutong. When I paid back my money, he habitually clicked the wallet on QQ and opened a dialog box B.

  • Liu ge had no money again, and I had no money. Then he opened his QQ mailbox C and sent an email D to Hu Zong, which was written in a very red large text: I have ten yuan for breakfast.
Look at the above four situations, A, B, C, and D, are actually related to HTML + CSS. How do you know it? A opens A webpage. In fact, B is also A webpage, but it is not opened by IE. C is generally used to access the webpage interface of the mailbox, and D, at the end of the scene, we can see that HTML + CSS is definitely related to the red text. Although you may not have found it, it is very simple, in any of the above scenarios, click the mouse button and you will surely see an option similar to the source code or meaning of the web page. Click it, you will see a text similar to the following:

    
  ...
Assume that you are Chen Zhen
Html is your bone
Css is the perfect muscle you train
Js is the basic trick to beat others.
Playing a movie requires saving time and special effects. Therefore, the director makes a set of common beautiful actions ----- <密宗拳>
This is jquery. It is only for less writing and higher efficiency.

In this case, css3 html5 is the ghost font version of Chen Zhen. The effect is more realistic and better-looking. html5 is the original version of you. Adding css is like a trip to South Korea, even your EX won't recognize you. JQUERY, however, means you want to make yourself better, so you have learned the maids dance, belly dance, pole dance, yoga, Pilates, flower arrangement, tea ceremony, cooking and so on. HTML5 is the fifth major modification to HTML. If you are interested, you can see my previous answer: Why is HTML5 so popular? -Programmers

We can describe it with no picture and no truth. We may explain it with a very vivid solution diagram:



You are not mistaken.

The example cited here is one of the greatest inventions in human history-female lingerie, aka. Bra.

I believe this image can help you understand what I mean more quickly.

Suppose we now use HTML, CSS3, and jQuery to design a Bra. At the initial stage of production, I need to use HTML to set what kind of clothes, coats, T-shirts, jeans, or Bra I want to make.

If I decide to use HTML to design a Bra, I need to define the basic information of this Bra, including shoulder straps, cups, hooks, and other components.

Next, I need to add more details. I use CSS to define the color and style of the Bra, such as the neck style, full cup, half cup, and other styles or lace, no trace of flesh and other details.

We know that HTML and CSS can present brilliant results to users when creating static webpages. However, if a webpage needs to interact with users, a script language, such as js, is required, if we want a better user experience, and we want the webpage to interact with the server without refreshing the new page, we need a js library that supports Ajax, currently, jQuery is widely used.

Back to the topic of Bra. If we need a Super Bra, we don't need to replace several bras if we want a female to use it, after you touch a button on the Bra, you can immediately aggregate or improve the effect. That is what jQuery is required for the Bra designed with HTML, CSS3, and jQuery.

To sum up, HTML, CSS, and jQuery are the most basic HTML, CSS, and jQuery technologies applied to HTML. CSS is good at processing the page layout of web applications, or make the page look better, jQuery is good at processing interaction, or makes web applications more easy to use and user-friendly.

I hope you can understand this. Open a Web page and block css. Vulgar metaphor:
HTML is body
CSS is clothing
Without clothes, the body is streaking and comparing the webpage to the House. html is the cement architecture of the house, css is the decoration, jquery is the dynamic things such as electrical appliances.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.