<!DOCTYPE html>
<html lang="en">
<!--here is comment for the coding-->
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>CSS selector</title>
<style>
* {
font-size: 18px;
font-weight: bold;
}
p {
color: red;
}
.p2 {
color: green;
}
#p3 {
color: blue;
}
div p {
color: cyan;
}
.p2,
#p3 {
font-style: italic;
}
</style>
</head>
<body>
<h1 align="center">Hello World</h1>
<h2>2 header</h2>
<h3>3级标题</h3>
<h4>4jibiaoqian </h4>
<h5>5jibiaoqian </h5>
<h6>6jibiaoqian </h6>
<p>this is a paragraph</p>
<p class="p2">here you are with class name p2 using ".p2"</p>
<p id="p3">here is related id number p3 using "#p3"</p>
<div>
<p>div中嵌套的p</p>
</div>
<a href="https://www.baidu.com">change to baidu</a>
<div><img src="demo.png" alt="图片" width="400px"></div>
</body>
</html>
结果:
HTML的DOM和CSS渲染的基础。