Home Web Front-end HTML Tutorial What is the relationship between html/css/js

What is the relationship between html/css/js

May 23, 2019 am 09:15 AM
html

HTML, CSS and JS are the main parts of a webpage: HTML defines the structure of a webpage, CSS describes the appearance of a webpage, and JS sets the behavior of a webpage. For example: HTML is like a person's bones and organs, CSS is human skin, these two constitute a vegetative person, plus js, a vegetative person, can respond to external stimuli, can think, move, and is a living person.

What is the relationship between html/css/js

I have been working for many years and have been busy applying various technologies. Now that I am not busy anymore, I ask myself what I am doing and what I can’t answer. Come to think of it, at work, we are often asked to achieve a goal quickly and cost-effectively, and use Du Niang to solve problems, but we don’t have time to understand the reasons. Today, I will summarize it from a macro perspective.

Introduction to HTML, CSS, JavaScript and simple division of labor

1. What is HTML (Hyper Text Markup Language)? HTML is used to describe web pages a language.
2. CSS (Cascading Style Sheets), the style defines how to display HTML elements, the syntax is: selector {property: value} (selector {property: value})
3. JavaScript is a script language, its source code does not need to be compiled before being sent to the client for execution. Instead, the character code in text format is sent to the browser for interpretation and execution by the browser.

For a web page, HTML defines the structure of the web page. CSS describes the appearance of a web page, and JavaScript settings. A very classic example is that HTML is like a person's bones and organs, and CSS is like human skin. With these two things, a vegetative person is formed, and with the addition of JavaScript, the vegetative person becomes You can respond to external stimuli, think, move, give yourself plastic surgery (change CSS), etc., and become a living person.

If HTML is the body, CSS is the surface, and Javascript is the soul. Without Javascript, HTML CSS is a vegetative state. Without Javascript and CSS, it is a disfigured vegetative state.
If HTML is the architect, CSS is the decoration, and Javascript is the magician.

How to connect these three together? Of course, it must be through the HTML of the web page. HTML is a description language. It describes itself to the browser, so how does it usually describe the specific web page? ?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>网页标题</title>
<link rel="stylesheet" type="text/css" href="mycss.css" />
<script type="text/javascript" src="myjs.js"></script>
</head>
<body>
<p>这是一个段落</p>
</body>
</html>
Copy after login

This is the simplest HTML document. What the document says is that for browsers, I follow the W3C standard XHTML1.0 transitional version specification (file type declaration). The encoding I use is utf-8, my title is "webpage title", the style sheet describing my appearance is my mycss.css file in the same directory, the javascript code related to me is in my myks.js file at the same level, my content There is a paragraph and the content of the paragraph is "This is a paragraph".

The above is the detailed content of What is the relationship between html/css/js. For more information, please follow other related articles on the PHP Chinese website!

Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

Video Face Swap

Video Face Swap

Swap faces in any video effortlessly with our completely free AI face swap tool!

Hot Tools

Notepad++7.3.1

Notepad++7.3.1

Easy-to-use and free code editor

SublimeText3 Chinese version

SublimeText3 Chinese version

Chinese version, very easy to use

Zend Studio 13.0.1

Zend Studio 13.0.1

Powerful PHP integrated development environment

Dreamweaver CS6

Dreamweaver CS6

Visual web development tools

SublimeText3 Mac version

SublimeText3 Mac version

God-level code editing software (SublimeText3)

Table Border in HTML Table Border in HTML Sep 04, 2024 pm 04:49 PM

Guide to Table Border in HTML. Here we discuss multiple ways for defining table-border with examples of the Table Border in HTML.

Nested Table in HTML Nested Table in HTML Sep 04, 2024 pm 04:49 PM

This is a guide to Nested Table in HTML. Here we discuss how to create a table within the table along with the respective examples.

HTML margin-left HTML margin-left Sep 04, 2024 pm 04:48 PM

Guide to HTML margin-left. Here we discuss a brief overview on HTML margin-left and its Examples along with its Code Implementation.

HTML Table Layout HTML Table Layout Sep 04, 2024 pm 04:54 PM

Guide to HTML Table Layout. Here we discuss the Values of HTML Table Layout along with the examples and outputs n detail.

HTML Input Placeholder HTML Input Placeholder Sep 04, 2024 pm 04:54 PM

Guide to HTML Input Placeholder. Here we discuss the Examples of HTML Input Placeholder along with the codes and outputs.

HTML Ordered List HTML Ordered List Sep 04, 2024 pm 04:43 PM

Guide to the HTML Ordered List. Here we also discuss introduction of HTML Ordered list and types along with their example respectively

Moving Text in HTML Moving Text in HTML Sep 04, 2024 pm 04:45 PM

Guide to Moving Text in HTML. Here we discuss an introduction, how marquee tag work with syntax and examples to implement.

HTML onclick Button HTML onclick Button Sep 04, 2024 pm 04:49 PM

Guide to HTML onclick Button. Here we discuss their introduction, working, examples and onclick Event in various events respectively.

See all articles