HTML 编辑基础(菜鸟必看篇)
什么是 HTML?
HTML(Hyper Text Markup Language),即超文本标记语言,是一种用于创建网页的标准标记语言。HTML 由一系列的标签(tag)组成,在每个标签中用来表示不同的网页内容。
HTML 编辑的基本流程
-
编写 HTML 代码
-
保存 HTML 文件
-
在浏览器中打开 HTML 文件
HTML 基础标签
下面介绍几个常用的 HTML 基础标签:
html
用于定义一个 HTML 文档。
<html>
<head>
<title>页面标题</title>
</head>
<body>
页面内容
</body>
</html>
head
用于定义 HTML 文档中的头部,包含了一些不会在页面上显示的信息,如页面标题等。
title
用于定义 HTML 文档的标题,将显示在浏览器的标题栏或标签页上。
body
用于定义 HTML 文档的主体,包含了所有显示在页面上的内容。
h1 - h6
用于定义 HTML 文档中的标题,分别对应不同的标题级别,h1 最大,h6 最小。
<h1>大标题</h1>
<h2>小标题</h2>
p
用于定义 HTML 文档中的段落。
<p>这是一个段落。</p>
a
用于定义 HTML 文档中的链接。
<a href="https://www.baidu.com/">百度一下</a>
嵌套标签
在 HTML 中,标签可以嵌套在其他标签中使用。
<p>这是一个包含<a href="https://www.baidu.com/">链接</a>的段落。</p>
示例说明
示例一
基于上述 HTML 基础标签,我们可以组装成一个完整简单的 HTML 页面。
<!DOCTYPE html>
<html>
<head>
<title>我的网页</title>
</head>
<body>
<h1>这是我的网页</h1>
<p>欢迎来访问我的网页。</p>
<p>以下是我的一些链接:</p>
<ul>
<li><a href="https://www.baidu.com/">百度</a></li>
<li><a href="https://www.google.com/">谷歌</a></li>
</ul>
</body>
</html>
示例二
增加使用 CSS 样式表来美化页面,如下所示:
<!DOCTYPE html>
<html>
<head>
<title>我的网页</title>
<style>
body {
background-color: #f0f0f0;
font-family: Arial, sans-serif;
}
h1 {
color: #c00;
text-align: center;
}
p {
font-size: 16px;
}
a {
color: #00f;
text-decoration: none;
}
ul {
list-style: none;
margin: 0;
padding: 0;
}
li {
margin-bottom: 10px;
}
</style>
</head>
<body>
<h1>这是我的网页</h1>
<p>欢迎来访问我的网页。</p>
<p>以下是我的一些链接:</p>
<ul>
<li><a href="https://www.baidu.com/">百度</a></li>
<li><a href="https://www.google.com/">谷歌</a></li>
</ul>
</body>
</html>
以上就是基础的 HTML 编辑攻略,希望对菜鸟们有所帮助。
本站文章如无特殊说明,均为本站原创,如若转载,请注明出处:HTML 编辑基础(菜鸟必看篇) - Python技术站