网页设计与制作-HTML5 + CSS3 课件 任务1 网页制作入门_第1页
网页设计与制作-HTML5 + CSS3 课件 任务1 网页制作入门_第2页
网页设计与制作-HTML5 + CSS3 课件 任务1 网页制作入门_第3页
网页设计与制作-HTML5 + CSS3 课件 任务1 网页制作入门_第4页
网页设计与制作-HTML5 + CSS3 课件 任务1 网页制作入门_第5页
已阅读5页，还剩22页未读， 继续免费阅读

下载本文档

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

文档简介

网页设计与制作HTML5+CSS3任务1

制作第一个HTML页面第1章网页制作入门知识目标技能目标素质目标（1）了解网页相关的概念与术语（2）熟悉HTML的发展历史（3）掌握HTML文档的结构（1）掌握SublimeText的基本操作（2）能够创建简单的网页（1）培养勤奋学习的态度（2）培养逻辑思维能力及实训操作能力（3）通过课前课中课后的行为规范，使学生养成良好的行为习惯网页相关知识常用的开发工具——SublimeTextHTML5基础任务实现第1章网页制作入门1.网页相关知识1.1网页与网站的相关概念1.2网页分类第1章网页制作入门1.1网页与网站的相关概念网

页1.网页相关知识网页究竟是什么？浏览新闻（信息）查询信息网上购物1.1网页与网站的相关概念以江西工业工程职业技术学院一个页面为例认识网页：1.网页相关知识打开谷歌浏览器，在地址栏输入/info/1031/11291.htm/info/1031/11291.htm文本图片文本超链接为了快速了解网页是如何形成的，在谷歌浏览器中按下F12，即可看到网页的源码1.1网页与网站的相关概念网页通常由文字、图像、链接、音频、视频等元素构成，通常是HTML文件。常见的网页文件是以.html或.htm为扩展名的，因此俗称为THML文件。网页是构成网站的基本元素1.网页相关知识网站是万维网上一组相关网页和有关文件的集合（本质是文件夹），实行分类管理，即用不同的文件夹管理。网页（WebPage）是网站中的一个页面，通常是HTML文件，它要通过浏览器来阅读。网站中一般有一个特殊的网页作为浏览的起始点，称为主页（或首页）。主页的文件名为index.html，其它页面称为内面或子页。1.2网页分类依据网页的位置：1.主页2.内页1.网页相关知识依据表现形式：1.静态网页2.动态网页网页相关知识常用的开发工具——SublimeTextHTML5基础任务实现第1章网页制作入门2.常用的开发工具——SublimeTextHTML5文档实质是一个文本文件，扩展名为.htm或者.html，常用的工具有Sublimetext、Hbuilder、Dreamweaver、NotePad++等等。2.1下载并安装2.2中文设置第1章网页制作入门2.1下载并安装2.常用的开发工具——SublimeTextWindows32位操作系统选择“Windows”64位操作系统选择“Windows64bit”下载安装包

官网下载链接：/32.1下载并安装2.常用的开发工具——SublimeText安装

双击安装包，点击next，注意勾选“Addtoexplorercontextmenu”，即添加右键菜单的选项，后续文档都可以使用SublimeText打开。点击“install”安装，直到“Finish”。2.2中文设置2.常用的开发工具——SublimeTextSublimeText操作界面默认的语言是全英文，根据需求可选择性地将sublimetext设置成中文。打开软件，点击Preference，选择最底部的PackageControl搜索框中输入关键字Install，选择PackageControl:InstallPackage2.2中文设置2.常用的开发工具——SublimeText等待插件列表加载完成，在搜索框中输入chinese，选择下拉框中的ChineseLocalizations，完成安装。网页相关知识常用的开发工具——SublimeTextHTML5基础任务实现第1章网页制作入门3.HTML5基础用户浏览网页时看到的内容原本都是HTML格式的，在浏览器中通过一些技术处理将其转换成为了可识别的信息。3.1HTML5文档基本格式3.2HTML5标签及属性3.3代码的注释第1章网页制作入门3.1HTML5文档基本格式3.HTML5基础HTML5文档的基本格式如下：<!DOCTYPEhtml><html>

<head>

<metacharset="UTF-8"/>

<title>Document</title>

</head>

<body>

</body></html>文档类型声明根标记头部标记主体标记3.1HTML5文档基本格式3.HTML5基础<!DOCTYPE>标签位于文档的最前面，用于向浏览器说明当前文档使用哪种HTML标准规范。<html>标签<!DOCTYPE>标签之后，也被称为根标签，用于告知浏览器其自身是一个HTML文档，<html>标志HTML文档的开始，</html>标志着HTML文档的结束。<head>标签用于定义HTML文档的头部信息，也被称为头部标签，紧跟在<html>标签之后。<body>标签用于定义HTML文档所要显示的内容，也成为主体标签。浏览器中显示的所有文本、图像、表单与多媒体元素等信息都必须位于<body>标签内。3.2HTML5标签及属性3.HTML5基础

HTML标签是由尖括号括起来的关键词，也称为HTML元素。分为两大类，分别是“双标签”与“单标签”。双标签

双标签是指由开始和结束两个标签符号组成的标签。语法：<标签名>内容</标签名>解释：<标签名>表示标签作用开始，一般称作“开始标签”。</标签名>表示标签作用结束，一般称作“结束标签”。例如：<h1>学院介绍</h1>3.2HTML5标签及属性3.HTML5基础单标签

单标签也称空标签，是指用一个标签符号即可完整的描述某个功能的标签。语法：<标签名/>例如：<br/> 用于实现换行。3.2HTML5标签及属性3.HTML5基础属性

使用HTML标签的属性来给HTML提供更多的信息语法：<标签名属性1="属性值1"属性2="属性值2"…/>内容</标签名>注意：一个标签可以拥有多个属性，必须写在开始标签中，位于标签名后面。属性之间不分先后顺序，标签名与属性，属性与属性之间均以空格分开。任何标签的属性都有默认值，省略该属性则取默认值。例如：单标签<hr/>表示在文档当前位置画一条水平线。3.3代码的注释3.HTML5基础注释HTML5代码注释采用<!--...-->标签。例如:<!--这是一

人人文库> 全部分类> 教育资料 > 课件下载

温馨提示

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

最新文档

评论

0/150

提交评论