《网页设计与前端开发 Dreamweaver+Flash+Photoshop+HTML+CSS+JavaScript 从入门到精通》—— 2.2 HTML文件的编写方法

简介:

本节书摘来异步社区《网页设计与前端开发 Dreamweaver+Flash+Photoshop+HTML+CSS+JavaScript 从入门到精通》一书中的第2章,第2.2节,作者: 何新起 , 任慎存 , 田月梅,更多章节内容可以访问云栖社区“异步社区”公众号查看。

2.2 HTML文件的编写方法

编写HTML的方法比较简单,可以使用任何一种文本编辑工具来编写,比如Dreamweaver、记事本等。

2.2.1 使用记事本手工编写HTML

HTML是一种以文字为基础的语言,并不需要什么特殊的开发环境,可以直接在Windows自带的记事本中编写。HTML文档以.html为扩展名,将HTML源代码输入到记事本并保存之后,可以在浏览器中打开文档以查看其效果。使用记事本编写HTML文件的具体操作步骤如下。

选择菜单中的【开始】|【所有程序】|【附件】|【记事本】命令,打开一个记事本,在记事本中即可编写HTML代码,如图2-1所示。

a32c804db22d18e2f6fc959b76279e836abab383

当编辑完HTML文件后,选择菜单中的【文件】|【保存】命令,弹出【另存为】对话框,将它存为扩展名为.htm或.html的文件即可,如图2-2所示。

165eceb5ddd5bb9bae5f745c78a04f0005b7318f

单击【保存】按钮,保存文档。打开网页文档,在浏览器中预览效果,如图2-3所示。

2284529c78fa9d616bf8f02262bd3d371c61ae20

提示
任何文字处理器都可以用来处理HTML代码,但必须记得要以.html的扩展名对其加以保存。

2.2.2 使用Dreamweaver编写HTML文件

使用Dreamweaver创建HTML文件,具体操作步骤如下。

打开Dreamweaver软件,新建一个文档,单击文档中的【代码】按钮,打开代码视图,在代码视图中可以输入HTML代码,如图2-4所示。

593cfdd0ed9a3fbecb329831d78a800319008f8c

输入代码完成后,切换到设计视图,效果如图2-5所示。

5bdfc852df81cc9ea898b3bebf2ecf572857368c
相关文章
|
24天前
|
Java
有关Java发送邮件信息(支持附件、html文件模板发送)
有关Java发送邮件信息(支持附件、html文件模板发送)
25 1
|
1月前
|
开发框架 前端开发 JavaScript
前端框架演进史:从HTML到现代化开发
前端框架演进史:从HTML到现代化开发
33 0
N..
|
25天前
|
移动开发 前端开发 JavaScript
HTML文件
HTML文件
N..
13 1
|
2天前
|
前端开发
css中几种隐藏元素的方法
css中几种隐藏元素的方法
7 0
|
3天前
|
JavaScript 前端开发 iOS开发
js实用方法记录-动态加载css/js
js实用方法记录-动态加载css/js
9 0
|
4天前
|
前端开发 搜索推荐 数据安全/隐私保护
HTML标签详解 HTML5+CSS3+移动web 前端开发入门笔记(四)
HTML标签详解 HTML5+CSS3+移动web 前端开发入门笔记(四)
13 1
|
6天前
|
Web App开发 前端开发 开发者
css检查方法
【4月更文挑战第13天】css检查方法
12 2
|
6天前
|
XML 前端开发 开发者
css的常用方法
【4月更文挑战第13天】css的常用方法
12 3
|
16天前
|
人工智能 前端开发 JavaScript
【前端设计】HTML+CSS+JavaScript基本特性
【前端设计】HTML+CSS+JavaScript基本特性
|
27天前
|
移动开发 前端开发 HTML5
Web前端全栈HTML5通向大神之路
本套课程共三大阶段,六大部分,是WEB前端、混合开发与全栈开发必须要掌握的技能,从基础到实践,是从编程小白成长为全栈大神的最佳教程!
35 3
Web前端全栈HTML5通向大神之路