《Web前端开发项目教程》认识网站和网页--制作第一个网页.pptxVIP

任务01-2 制作第一个网页项目01 认识网站和网页 任务01-2：制作第一个网页 知识点掌握HTML5文档的基本格式理解Web标准 技能点学会使用HbuilderX创建简单网页 一、常用HTML编辑器1.记事本初学者学习写HTML文件时经常会用到的一个工具，因为网页本身就是超链接文本文件，在记事本中键入HTML代码后，在“文件”菜单选择“另存为”命令，将文档保存为.htm或者.html扩展名的文件，使用浏览器打开就可以浏览网页了。3 一、常用HTML编辑器2.HbuilderXHBuilder是DCloud推出的一款支持HTML5的Web开发集成开发环境，主体由Java编写，速度快，通过完整的语法提示和代码输入法、代码块等能大幅提升HTML、JS、CSS的开发效率。HBuilderX是HBuilder的下一代版本，官方自述为“轻如编辑器、强如IDE的合体版本”，体积小、灵活，而且由我国的前端开发人员编写，使用方便。4 一、常用HTML编辑器Adobe Dreamweaver CSSublimeText3汉化版等5 二、在Hbuilder中新建网页 三、HTML5的文档结构7头部部分主体部分html…/html标签标记 HTML 文档的开始和结束这部分包括标题和其他说明信息。包括在 head…/head 标签内，一般来说，位于头部的内容都不会在网页内直接显示这部分包含文本、图像和链接。它包括在 body…/body 标签内文档类型声明!DOCTYPE htmlhtml head meta charset=utf-8 title/title /head body !-- 文档主体，定义页面显示的内容 -- /body/html 标签HTML 标签是由尖括号包围的关键词，比如 html，也叫标记双标签：成对出现,比如body/body,标签对中的第一个标签是开始标签，第二个标签是结束标签单标签：hr / br / 单标签要添加斜杠，例如 br /（空行）来关闭，不加在一些浏览器中也可以。HTML 标签对大小写不敏感，HTML5.0版本中，W3C明确规定，标签必须用小写格式。 !DOCTYPE声明DOCTYPE是Document Type（文档类型）的简写，在页面中，用来指定页面所使用的XHTML（或者HTML）的版本。只有确定了一个正确的DOCTYPE，XHTML里的标识和CSS才能正常生效。!DOCTYPE html------声明HTML 5，大多网站都为html5!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN“-----声明 HTML4.01，有3种DTD（文档类型定义）声明可以选择：过渡的（Transitional）、严格的（Strict）和框架的（Frameset）。过渡型标准下，浏览器对文档的解析比较宽松。一些老版本的网站依然延用。 HTML文档头部标记head/headhead与/head之间的标记只控制页面的性能而不会显示在网页上。一个文档只能有一对head标记。通常title/title、meta /、link /等标记可以放在head部分。1.title/title设置页面标题2.meta /用于定义页面中的信息，例如文档的关键字、作者及描述等，在头部可以包含任意数量的meta /标记3.link/引用外部文件 title/title head meta charset=utf-8 title网上商城/title /head meta /meta /用于定义页面中的信息，基本语法如下：meta charset=“UTF-8”/ 代表世界通用的语言编码； meta name=“” content=“” / name属性值可以是有哪些信誉好的足球投注网站内容名，如author 、keywords、description等，而content属性对应有哪些信誉好的足球投注网站内容值。便于有哪些信誉好的足球投注网站引擎查找信息和分类信息 meta /meta http-equiv =“” content=“” /meta的属性还可以是http-equiv，使用http-equiv/content参数可设置服务器发送给浏览器的http头部信息，为浏览器显示该页面提供相关参数.meta http-equiv=refresh content=“2 表示每隔2秒，自动刷新网页 meta http-equiv=refresh content=“5;url=” 间隔5秒后，自动刷新到163邮箱登录页面 link/一个页面允许使用多个link /标记引用多个外部文件。例如：link rel=stylesheet href=p