【HTML教程】如何创建HTML网页

  • HTML文件是一种文本文件,因此我们可以使用任何文本编辑器来创建它。
  • 文本编辑器是用来编辑纯文本的程序,因此要创建网页,我们需要在某些文本编辑器中编写代码。
  • 您可以选择下载各种类型的文本编辑器,但对于初学者来说,最好使用记事本(Windows)或TextEdit(Mac)。
  • 一旦掌握了基础知识,您就可以轻松地使用其他专业的文本编辑器,比如Notepad++、Sublime Text、Dreamweaver等。
  • 在我们的教程中,我们将介绍如何使用记事本和Dreamweaver来创建您的第一个网页。

A. 带有记事本的 HTML 代码(推荐给初学者)

记事本是一个简单的文本编辑器,适合初学者学习 HTML。它在所有版本的 Windows 中都可用,您可以从那里轻松访问它。
第 1 步:打开记事本 (Windows)
【HTML教程】如何创建HTML网页插图
第 2 步:用 HTML 编写代码
【HTML教程】如何创建HTML网页插图1
第 3 步:使用 .htm 或 .html 扩展名保存 HTML 文件
【HTML教程】如何创建HTML网页插图2
第 4 步:在网络浏览器中打开 HTML 页面。
 
要运行 HTML 页面,您需要打开保存文件的文件位置,然后双击文件或单击打开选项
【HTML教程】如何创建HTML网页插图3
【HTML教程】如何创建HTML网页插图4

B.使用 Dreamweaver 编写 HTML 代码。(学习 HTML 基础后推荐使用)

当你学习了 HTML 的基础知识后,你可以使用一些专业的文本编辑器,这将帮助你编写高效快速的代码。所以要使用 Sublime Text 编辑器,首先需要从互联网上下载并安装。
当 Sublime 文本编辑器安装完成后,您可以按照简单的步骤使用它:
第 1 步:打开 Dreamweaver 编辑器(Windows 7):
要打开 Dreamweaver 编辑器,请转到“开始”屏幕 ⤏ 输入Dreamweaver ⤏ 打开它。要打开新页面,请按CTRL+N。
【HTML教程】如何创建HTML网页插图5
第 2 步:在编写任何代码之前保存页面。
 
要在Dreamweaver 中保存您的页面,请按 Ctrl+S 或转到文件选项 ⤏ 保存,以使用扩展名 .htm 或 .html 保存文件。我们建议先保存文件再编写代码,因为保存页面后Dreamweaver 编辑器会给你建议编写代码。
【HTML教程】如何创建HTML网页插图6
第 3 步:在 Dreamweaver 编辑器中编写代码
【HTML教程】如何创建HTML网页插图7
第 4 步:在浏览器中打开 HTML 页面
 
要在 Web 浏览器中执行或打开此页面,只需在 Dreamweaver 页面上先保存当前页面,然后单击“按一下键盘上的F12按钮打开”。
【HTML教程】如何创建HTML网页插图8
【HTML教程】如何创建HTML网页插图9

HTML代码获取

<!DOCTYPE html>
<html>
<head>
  <title>HTML简介</title>
</head>
<body>

<h1>HTML简介</h1>
<p>HTML是超文本标记语言(HyperText Markup Language)的缩写。它是用来创建网页的标准标记语言,由一系列的元素(elements)组成,这些元素可以包围文本和图片,告诉浏览器如何展示页面的内容。</p>

<h2>HTML基本结构</h2>
<p>一个简单的HTML文档由以下部分组成:</p>
<pre>
&lt;!DOCTYPE html&gt;
&lt;html&gt;
&lt;head&gt;
  &lt;title&gt;这里是页面标题&lt;/title&gt;
&lt;/head&gt;
&lt;body&gt;

  &lt;h1&gt;这里是主标题&lt;/h1&gt;
  &lt;p&gt;这里是一个段落。&lt;/p&gt;

&lt;/body&gt;
&lt;/html&gt;
</pre>

<h2>学习更多</h2>
<p>要深入了解HTML,你可以查阅玖华IT知识之家的HTML目录:<a href="https://blog.jhacd.com/cjym/html/">https://blog.jhacd.com/cjym/html/</a> </p>

</body>
</html>

注意:您可以在任何浏览器中执行 HTML 文件,但有些 Web 浏览器不支持某些标签。

版权声明 1 本网站名称:玖华IT知识分享
2 本站永久网址:https://blog.jhacd.com
3 当前文章地址:https://blog.jhacd.com/374.html
4 本站资源大多存储在云盘,如发现链接失效,请联系我们我们会第一时间更新。
5 本站一切资源不代表本站立场,并不代表本站赞同其观点和对其真实性负责。
6 本站一律禁止以任何方式发布或转载任何违法的相关信息,访客发现请向站长举报
7 本网站的文章部分内容可能来源于网络,仅供大家学习与参考,如有侵权,请联系站长 QQ:81754131,进行删除处理。
THE END
分享
二维码
打赏
< <上一篇
下一篇>>