HTML basics (implement the effect of simple HTML pages)

Familiar with the realization method of HTML webpage design.
Understand the basic grammar rules.
Familiar with HTML webpage coding standard.
Realize simple static webpage design

Label definition paragraph

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
      <title>第一网页</title>
</head>
<body>
       <p>这是段落</p>
       <p>这是段落</p>
       <p>这是段落</p>
</body>
</html>

Operation result
Insert picture description here
2. The element defines the main body of the document, and the web page background can be designed through background-color

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
      <title>第二网页</title>
</head>
<body style="background-color:blue">
    <p>
    <b>请看：改变了颜色的背景</b>
    </p>
</body>
</html>

Run result
Insert picture description here
3. The
label is used for line breaks

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
      <title>第三网页</title>
</head>
<body>
     第一<br>
     第二<br>
     第三<br>
</body>
</html>

Operation result
Insert picture description here
4. The label specifies the font, font size and font color of the text

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>第四网页</title>
</head>
<body style="background-color:pink">
     <h2 align="center">
     <font color="red">绝句</font>
     </h2>
     <h4 align="center">杜甫</h4>
     <p align="center"> 
     <font size="S" face="华文行楷" color="blue">                                               
     两个黄鹂鸣翠柳，一行白鹭上青天<br>
     窗含西岭千秋雪，门泊东吴万里船<br>
      </font>
    </p>
    <hr width="100%" size="0.5px" color="green"/>
    <font size="2px"> 
      这首《绝句》是诗人住在成都浣花溪草堂时写的，描写了草堂周围明媚秀丽的春天景色。（杜甫），字于美，其先襄阳人。<br/>
    </font>
</body>
</html>

Insert picture description here
5. Indicates the size of the title

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
      <title>第五网页</title>
</head>
<body style="background-color:blue">
          <h1>Look!Styles and colors</h1>
          <h3><font face="Verdana" color="red">This text is in Verdana and red</font>
          </h3>
          <h4><font face="Times" color="green">This text is in Times and green</font>
          </h4>
          <p><font size="30px">This text is 30 pixels high</font>
          </p>
</body>
</html>

Insert picture description here
Understand the usage of various tags, can design beautiful and elegant web pages according to the requirements ~
Of course, there are more than these tags, you can query the use of tags according to different requirements

Question three questions qwq

Published 3 original articles · Likes0 · Visits13

Private letter concerns

HTML basics (implement the effect of simple HTML pages)

Guess you like