• 欢迎访问举个栗子网站
  • 小说APP下载 xsz.tw 不带广告的小说站

举个栗子:初识HTML5,用dreamweaver创建第一个HTML5文件

网站 举个栗子 2年前 (2017-11-16) 417次浏览 0个评论 扫描二维码

HTML文件由元素和标签组成,能在网站上显示的一种文件形式。今天我就来分享基础 HMTL 的基础知识,带新手认识认识 html5,并用 Dreamweaver 创建一个网页文档。

工具/原料

  • Dreamweaver 最新班的软件,没有的朋友可以去网上下载。

新建 HMTL5

  1. 1

    打开安装好的 Dreamweaver 软件,选择菜单栏中的“文件”->“新建”。

    初识 HTML5,用 dreamweaver 创建第一个 HTML5 文件

  2. 2

    在新建文档中,选择文档类型选择 HTML5。

    初识 HTML5,用 dreamweaver 创建第一个 HTML5 文件

  3. 3

    确定之后我们就可以看到我们创建的 html 的代码了,给我创建的 HTML文件取名为“myhtmleg1”。Dreamweaver 自动给我添加了一部分代码,接下来我就带大家认识认识这些代码。

    初识 HTML5,用 dreamweaver 创建第一个 HTML5 文件END

HTML5 代码解释

  1. 1

    我们可以看到<HTML></HTML>有这一对标记,它表示文档的开头和结尾,<HTML>上面的代码<!doctype html>指明了文档类型,代码部分是从<html></hml>对中开始的。

    看下图红框中的部分是不是在开始和结尾处。

    初识 HTML5,用 dreamweaver 创建第一个 HTML5 文件

  2. 2

    可以看到<html></hmtl>中间包括了两个部分,第一部分是头部,我们在这里面设置标题,或者引用外部文件的连接以及 js 文档等等可以在这设置。现在我在头部<head></head>中设置文档的标题,输入代码:<title>我是 HTML5 文件</title>。现在在浏览器中查看效果吧。

    初识 HTML5,用 dreamweaver 创建第一个 HTML5 文件

  3. 3

    我用的这个最新的 Dreamweaver 软件在浏览器中查看的方法如下:

    选择要在浏览器中查看的,文件右键“在浏览器中打开”->“选择浏览器”,我这里选择火狐浏览器。选择界面如下图

    初识 HTML5,用 dreamweaver 创建第一个 HTML5 文件

  4. 4

    如果文件没有保存点击保存,之后就可以在火狐浏览器中看到效果了。如下图红圈中的标题是不是就变成了我们设置的内容呢。

    初识 HTML5,用 dreamweaver 创建第一个 HTML5 文件

  5. 5

    第二部是主体部分,我们后续操作基本上都在<body></body>中完成,他是一个网站的主体,所有要显示的内容都在它里面涉及。在这里我让主体部分输出一个欢迎信息,具体代码如下

    初识 HTML5,用 dreamweaver 创建第一个 HTML5 文件

  6. 6

    将刚编写的文件保存下,在浏览器中查看,是不是输出了欢迎信息呢。具体如下图。

    初识 HTML5,用 dreamweaver 创建第一个 HTML5 文件END


举个栗子 , 版权所有丨如未注明 , 均为原创丨本网站采用BY-NC-SA协议进行授权
转载请注明原文链接:举个栗子:初识 HTML5,用 dreamweaver 创建第一个 HTML5 文件
喜欢 (0)
举个栗子
关于作者:
建筑工地上施工员,闲暇时弄个博客打发时间,
发表我的评论
取消评论
表情 贴图 加粗 删除线 居中 斜体 签到

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址