- 网页设计与制作教程:Web前端开发(第7版)
- 刘瑞新主编
- 668字
- 2024-06-18 18:27:30
1.3 用记事本编辑HTML文档
常用的HTML编辑软件有Adobe Dreamweaver、Visual Studio Code、HBuilder X、Sublime Text3汉化版、Notepad++、记事本等。任意文本编辑器都可以用于编写网页源代码,对于初学者,最常用的文本编辑器就是Windows自带的记事本。本书前几章的网页源代码建议在记事本中手工输入,有助于初学者对网页结构和样式有更深入的了解。后几章在HBuilder X中编辑,以提高编辑效率。
![](https://epubservercos.yuewen.com/853F7D/29810394404576006/epubprivate/OEBPS/Images/21_01.jpg?sign=1738947848-gEeZjOGpECZYFCbqJ1z6OFVONDikMtbB-0-0b5ffdb17b63d902f9f31d2efca13a1a)
1.3 用记事本编辑HTML文档
【例1-1】用“记事本”创建一个只有文本组成的简单页面,通过它学习HTML文档的编辑、保存和运行的过程。HTML代码如下。
![](https://epubservercos.yuewen.com/853F7D/29810394404576006/epubprivate/OEBPS/Images/21_02.jpg?sign=1738947848-XEp66ckEOgEWgxrwFsDQG7Hk9qN2y0sL-0-667fb61158560ffe6cd888482fbfd7b2)
![](https://epubservercos.yuewen.com/853F7D/29810394404576006/epubprivate/OEBPS/Images/22_01.jpg?sign=1738947848-x94bDq6jHUhgqTVySKssdZkWj9fAZnAf-0-1ad34dd871ccd1bd449f84e4a2eb9528)
1)打开记事本:单击Windows的“开始”按钮,然后在搜索框中输入“记事本”,在搜索结果中单击“记事本”。
2)编写HTML代码:在空白的记事本窗口中输入HTML代码,显示如图1-3所示。
3)保存HTML文件:在记事本的“文件”菜单中,选择“保存”选项。显示“另存为”对话框,在“保存在”下拉列表框中选择文件要存放的路径,在“文件名”文本框中输入以.html为扩展名的文件名,如1-1.html,在“保存类型”下拉列表框中选择“文本文档(*.txt)”选项,在“编码”下拉列表框中选择“UTF-8”,如图1-4所示。最后单击“保存”按钮,将记事本中的内容保存在D:\中。
![](https://epubservercos.yuewen.com/853F7D/29810394404576006/epubprivate/OEBPS/Images/22_02.jpg?sign=1738947848-KU1sb3HkCOvq88hOjMsOdtpeU7JbPrOG-0-ef707c983eb855e3b0c12ce3879f251a)
图1-3 输入HTML代码
![](https://epubservercos.yuewen.com/853F7D/29810394404576006/epubprivate/OEBPS/Images/22_03.jpg?sign=1738947848-sQFjNIAtCmbPEBUt5hI3AND8AGCUKcmq-0-f0e2eeb5f75bc48658b03e7382e684fc)
图1-4 记事本的“另存为”对话框
4)运行网页文件:现在,已经在记事本中创建了一个HTML文件,可以在浏览器中打开它并查看效果。只需在文件资源管理器中找到刚刚保存的文件1-1.html,如图1-5所示。然后双击它,它将在默认浏览器中打开,即可看到网页的显示结果,如图1-6所示。
![](https://epubservercos.yuewen.com/853F7D/29810394404576006/epubprivate/OEBPS/Images/22_04.jpg?sign=1738947848-FirdtZ1pSDqL65NFHywcyc37kDO7uLX9-0-54361d6e335ac4cd4b2bfc4ec42399a5)
图1-5 双击网页文件
![](https://epubservercos.yuewen.com/853F7D/29810394404576006/epubprivate/OEBPS/Images/22_05.jpg?sign=1738947848-bPqCv8P5Au4DclOpxxzfQWlSyxDWOey3-0-73b2e186e4639aaa6ce060e30d77d9d9)
图1-6 在浏览器中显示网页
注意:如果保存时选择的编码是“ANSI”,中文将显示为乱码。修改网页文件时仍然用“记事本”打开网页文件,然后编辑网页文件,并保存。