HTML webpage design: two, the basic tags of the webpage

Basic tags for web pages


1. Title tag

Basic heading tags: The first-level headings are the largest, and successively smaller and smaller.

<h1>First-level tags</h1>
<h2>Second-level tags</h2>
<h3>Third-level tags</h3>
<h4>Four-level tags</h4>
<h5>Five-level tags</h5>
<h6>Six-level label</h6>

The code example is as follows:

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>标题标签学习</title>
</head>
<body>
	<h1>一级标签</h1>
	<h2>二级标签</h2>
	<h3>三级标签</h3>
	<h4>四级标签</h4>
	<h5>五级标签</h5>
	<h6>六级标签</h6>
</body>
</html>

The web page is displayed as follows:
Insert picture description here

2. Paragraph tags

<p>Paragraph</p>

The code example is as follows:

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>段落标签学习</title>
</head>
<body>
	<!-- 未使用段落标签 !-->
	我寻你千百度 又一岁荣枯
	可你从不在 灯火阑珊处
	
	我寻你千百度 日出到迟暮	
	一瓢江湖我沉浮
	<!-- 使用段落标签 !-->
	<p>我寻你千百度 又一岁荣枯</p>
	<p>可你从不在 灯火阑珊处</p>
	<p>     </p>
	<p>我寻你千百度 日出到迟暮</p>
	<p>一瓢江湖我沉浮</p>
</body>
</html>

The web page is displayed as follows:
Insert picture description here

3. Newline label

<br/>

        <br>The tag is an empty tag, that is, there is no closing tag, so <br>…</br> is wrong. It must be written in xml.<br/>Because xml requires all tags to be closed, add / Indicates that the label is closed. The two have the same effect, but the former is the old html specification, and in the new specification W3C//DTD HTML 4.0 requires that everything should have a terminator like xml in order to strictly regulate.

The code example is as follows:

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>换行标签学习</title>
</head>
<body>
	<!-- 未使用换行标签 !-->
	我寻你千百度 又一岁荣枯
	可你从不在 灯火阑珊处
	
	我寻你千百度 日出到迟暮	
	一瓢江湖我沉浮
	<!-- 使用换行标签 !-->
	我寻你千百度 又一岁荣枯<br/>
	可你从不在 灯火阑珊处<br/>
	<br/>
	我寻你千百度 日出到迟暮<br/>	
	一瓢江湖我沉浮<br/>
</body>
</html>

The web page is displayed as follows:
Insert picture description here

The difference between paragraph tags and line break tags: In the generated web page, there is a space before and after the paragraph, but there is no space between each line of the line break.

4. Horizontal line label

<hr/>

        In HTML, the <hr> tag does not have an end tag. In XHTML, the <hr> must be closed correctly, such as <hr/>, the same as the <br/> tag. It is used by the standard and needs to be followed by a backslash Kong.

The code example is as follows:

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>水平线标签学习</title>
</head>
<body>
	hello
	<hr/>
	world
</body>
</html>

The web page is displayed as follows:
Insert picture description here

5. Comments

<!—This is a comment. The comment will not be displayed in the browser. –>

The shortcut for comments in dw is to select the content to be annotated and press ctrl+shift+/

The code example is as follows:

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>注释标签学习</title>
</head>
<body>
	<!--这是一段注释,不会再网页上显示。-->
	<p>这是一个普通的段落。</p>
	这是一个普通的句子。<br/>
	这是一个普通的句子。<br/>
</body>
</html>

The web page is displayed as follows:
Insert picture description here

6. Special symbols

Space: 
greater than sign>:>
less than sign<:<
copyright symbol ©:©

The code example is as follows:

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>特殊符号学习</title>
</head>
<body>
	<!--空格-->&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<br/>
	<!--大于号-->
	x&gt;y<br/>
	<!--小于号-->
	1&lt;2<br/>
	<!--版权符号-->
	这是一个版权符号:&copy;
</body>
</html>

The web page is displayed as follows:
Insert picture description here

Guess you like

Origin blog.csdn.net/xfjssaw/article/details/115012649