HTML5+CSS3网页设计任务教程(第2版) 课件 单元1 HTML5静态网站开发概述_第1页
HTML5+CSS3网页设计任务教程(第2版) 课件 单元1 HTML5静态网站开发概述_第2页
HTML5+CSS3网页设计任务教程(第2版) 课件 单元1 HTML5静态网站开发概述_第3页
HTML5+CSS3网页设计任务教程(第2版) 课件 单元1 HTML5静态网站开发概述_第4页
HTML5+CSS3网页设计任务教程(第2版) 课件 单元1 HTML5静态网站开发概述_第5页
已阅读5页,还剩12页未读 继续免费阅读

下载本文档

版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领

文档简介

HTML5静态网站开发概述单元1目录01常用HTML5开发环境的搭建02完成第一个HTML5页面1-1HTML5+CSS3网页设计任务教程(第二版)常用HTML5开发环境的搭建1234技能知识网站目录结构网页命名规范开发环境搭建四大命名规范任务1-1

常用HTML5开发环境的搭建HBuilderX是数字天堂(北京)网络技术有限公司,即DCloud推出的集成开发环境,是免费绿色软件,可从DCloud官网https://www.dcloud.io/hbuilderx.html上直接下载。HBuilderX简称HX,HBuilder,H是HTML的缩写,Builder是建设者。是为前端开发者服务的通用IDE,或者称为编辑器。与vscode、sublime、webstorm类似。由于HX的轻巧、极速、小程序支持等特点,赢得了广大用户的喜爱,是900万开发者的选择。任务1-1常用HTML5开发环境的搭建

任务1-1

常用HTML5开发环境的搭建1、css文件夹。这个文件夹是用来存放网站的样式文件,样式文件的文件扩展名为.css。2、img文件夹。这个文件夹是用来存放网站页面显示的图片文件,常用的图片文件格式为.jpg,其他的比如.png,.gif等格式的图片文件也需要放置在此文件夹中。3、js文件夹。这个文件夹是用来存放完成网站相关功能的脚本文件,脚本文件的扩展名为.js。4、index.html文件。一个静态网站的首页面文件默认使用index.html命名,所以在HX中创建一个Web项目时会自动创建好一个空的index.html文件。任务1-1

常用HTML5开发环境的搭建常用HTML5开发环境的搭建1、骆驼命名法:也称为小驼峰命名法,当标识符是由一个或多个单词连结在一起构成的唯一识别字时,第一个单词以小写字母开始,之后每个单词的首字母都大写。例如:myFirstName、myLastName,这样的标识符看上去就像骆驼峰一样此起彼伏,故得名。2、帕斯卡命名法:也称为大驼峰命名法,与骆驼命名法相似,不同的是帕斯卡命名法的第一个单词是以大写字母开始。例如:MyFirstName、MyLastName。常用HTML5开发环境的搭建3、匈牙利命名法:其命名的基本原则是,变量名=属性+类型+对象描述。标识符的名字以一个或者多个小写字母开头作为前缀,前缀之后的是首字母大写的一个单词或多个单词组合,该单词要指明变量的用途。如:iMyAge、cMyName[10]、fManHeight表示三个变量的类型分别为int、char、float。4、下划线命名法:此法在命名中用到的单词使用小写字母,每个单词直接用下划线‘_’分割,例如:book_author、book_price。在此推荐统一使用子页面功能翻译的英文命名,命名规则采用骆驼命名法。页面文件的命名统一用小写的英文字母,数字和下划线的组合,不得包含汉字空格和特殊字符。推荐统一使用子页面功能翻译的英文命名,如:首页—index.html、产品列表—proList.html产品详细页面—proDetail.html、新闻列表—newsList.html

新闻详细页面—newsDetail.html、发展历史—history.html关于我们—about.html、联系我们—contact.html任务1-1

常用HTML5开发环境的搭建1-2HTML5+CSS3网页设计任务教程(第二版)完成第一个HTML5页面任务1-2完成第一个HTML5页面<title>标签的使用<body>标签的使用HTML5注释的使用<meta>标签的使用完成第一个HTML5页面HTML文档的根元素(标签)标签的内容通常给浏览器看的指页面标题标签的内容给人看的1、<meta>标签<meta>标签是用来描述一个HTML页面文档的属性,可提供有关页面的元信息,例如作者、日期和时间、网页描述、关键词、页面刷新等。2、<title>标签<title>标签是用来定义一个HTML页面文档的标题。3、<body>标签<body>标签用来定义页面文档的主体。任务1-2完成第一个HTML5页面1、在HTML5中,注释标签用于在源代码中插入注释,注释不会显示在浏览器中。注释标签的格式为:<!--注释的内容-->。2、在HTML5中可使用注释对相关代码进行解释,这样做有助于自己在以后或者其他开发人员对代码进行修改,尤其是在编写大量代码时注释的作用非常明显。3、在后面的学习中需要在页面文档中添加脚本时,使用注释标签来隐藏浏览器不支持的脚本也是一个好习惯。4、在HTML5中,注释标签仅仅起到解释相关代码的作用,它不支持任何的标准属性和事件属性。任务1-2完成第一个HTML5页

温馨提示

  • 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

最新文档

评论

0/150

提交评论