HTML basics

Let’s learn some basic HTML tags through some examples

##HTML Title

HTML heading (Heading) is defined through <h1> - <h6> tags.

Example

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>
 
<h1>这是标题 1</h1>
<h2>这是标题 2</h2>
<h3>这是标题 3</h3>
<h4>这是标题 4</h4>
<h5>这是标题 5</h5>
<h6>这是标题 6</h6>
 
</body>
</html>

will output:

This is title 1

This is title 2

This is title 3

This is title 4

This is title 5

This is title 6

HTML paragraph

HTML paragraph is defined by the tag <p>.

Example

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>
 
<p>一个段落。</p>
<p>另一个段落。</p>
<p>还是一个段落。</p>
 
</body>
</html>

Output:

A paragraph.

Another paragraph.

is still a paragraph.

#HTML Link HTML links are defined through the tag <a>.

Example

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>
 
<a href="http://www.php.cn">这是一个链接使用了 href 属性</a>

</body>
</html>

Output:

This is a link using the href attributeTips: Specify the address of the link in the href attribute.

(You will learn more about properties later in this tutorial).

HTML imagesHTML images are defined through the tag <img>.

Example

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>
 
<img src="/upload/course/000/000/008/57faf9bfe885a872.jpg" width="300" height="180" />
 
</body>
</html>

Output:

Note: The name and size of the image are provided as attributes.

Continuing Learning

new file

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>
<h1>标题</h1> 
<p>句子内容</p>
<a href="http://www.php.cn">链接 PHP.CN</a>
<!--<br>为换行标签 后面的章节会学习到 -->
<br><br> 
<img src="https://img.php.cn/upload/course/000/000/008/57faf9bfe885a872.jpg" width="300" height="180" />
</body>
</html>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX