https://www.cnblogs.com/yangfengwu/p/10947388.html
I told you in the previous section, install this software, install it yourself...
In this section, let’s use this software to learn web development
Set the project path yourself
Let's run it first
There are more new projects than in the previous section
<head> General implementation of functional programs </head>
<body> generally puts the page layout part </body> is to put what we see on the page
Please learn other details by yourself
https://www.runoob.com/tags/att-meta-charset.html
Will there be a dull phenomenon???
Actually write the same
<!DOCTYPE html> <!--tell the browser that this is an html document-->
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
< /head>
<body>
<h1>Mandarin</h1>
</body>
</html>
<!DOCTYPE html> <!--tell the browser that this is an html document-->
<html lang="en">
<head>
<meta charset="UTF-8">
<title>This is the title displayed on the webpage </title>
<script>
function click1() {//function
alert("displayed content");//pop up a box
}
</script>
</head>
<body>
<h1 οnclick="click1()" >Mandarin</h1>
</body>
</html>
It's just that there are more rules, which are some things written in it
In the past, changing the properties of the control was directly modified in html. Now let's create a new .css file, put the properties in this, and then call and use it in html.
The name is arbitrary
Nothing after the new build
Look at the first way first, add an ID
Then in the layout file, set the color of the control with ID id1 to red
But it is not possible to run now, it needs to be quoted in html,
<!DOCTYPE html> <!--tell the browser that this is an html document-->
<html lang="en">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" type= "text/css" href="lesson2.css"/>
<title>This is the title displayed on the webpage</title>
<script>
function click1() {//function
alert("displayed content");//popup A box
}
</script>
</head>
<body>
<h1 οnclick="click1()" id="id1">Mandarin</h1>
</body>
</html>
<link rel="stylesheet" type="text/css" href="lesson2.css"/>
https://www.runoob.com/tags/att-link-rel.html
Tell the browser that I want to import a layout style file. The file is a css-type text file followed by the file name
Run it
Then talk about the path problem
Because our html file and .css file are in the same folder, you can directly
If you are not in a folder, you can use XXXXX in the current directory of ./XXXX or XXXXX in the previous directory of ../XXXX in the current directory. You should understand this...
another way:
If the initial colors of many controls are all red, is it necessary to write all of them????
Provides another way
Let's add another label
<!DOCTYPE html> <!--tell the browser that this is an html document-->
<html lang="en">
<head>
<meta charset="UTF-8">
<!--tell the browser that I want Importing a layout style file is a css type text file followed by the file name -->
<link rel="stylesheet" type="text/css" href="lesson2.css"/>
<title>This is The title displayed on the webpage</title>
<script>
function click1() {//function
alert("displayed content");//a box pops up
}
</script>
</head>
<body>
<h1 οnclick=" click1()" id="id1">Mandarin</h1>
<h1 id="id2">Yang</h1>
</body>
</html>
#id1{
color: red;
}
#id2{
color: red;
}
It’s okay if there are fewer controls, but it’s not good if there are too many
Now, use Class
<!DOCTYPE html> <!--tell the browser that this is an html document-->
<html lang="en">
<head>
<meta charset="UTF-8">
<!--tell the browser that I want Importing a layout style file is a css type text file followed by the file name -->
<link rel="stylesheet" type="text/css" href="lesson2.css"/>
<title>This is The title displayed on the webpage</title>
<script>
function click1() {//function
alert("displayed content");//a box pops up
}
</script>
</head>
<body>
<h1 οnclick=" click1()" id="id1" class="TestClass">Mandarin</h1>
<h1 id="id2" class="TestClass" >Yang</h1>
</body>
</html>
<h1 οnclick="click1()" id="id1" class="TestClass">Wenhua</h1> <h1 id="id2" class="TestClass" >Yang</h1> Both texts are quoted The same class TestClass
Then in css
.TestClass{
color: red;
}
Run it, just think of it, no one will not run it
https://item.taobao.com/item.htm?spm=a1z38n.10677092.0.0.3e3b1deb80xzYz&id=569295486025 https://www.cnblogs.com/yangfengwu/p/11037653.html