-
第一章网页设计基础
本章主要介绍网页设计相关概念、技术及开发工具使用方法。
-
●1.1web网站初体验
web网站初体验简介:本节课主要介绍网页概念、内容组成及核心技术。
-
●1.2hbuilder开发工具
本节课主要介绍Hbulider工具的下载、安装及使用方法,包括html文件、js文件、css文件的创建、保存及运行。
-
●1.3html5基本结构
本节课主要介绍html5基本结构以及代码注释的功能和注释的方法,并通过html5基本结构实际设计了一张简单网页。
-
第二章HTML5标签
本章主要介绍了html5文件基本结构以及常用的标签,包括文字标签、段落标签、图片标签、列表标签和链接标签。
-
●2.1制作51商城购头部页面
本节课主要介绍了标签定义及标签结构,以及p、h、br、em、strong、sup、sub、div、span、img、特殊符号等常用标签及属性,并应用相关标签实现商品具体信息网页和51商城购头部网页的制作。
-
●2.2列表标签
本节课我们主要介绍了无序列表、有序列表和自定义列表的标签及属性,并应用列表标签实现心理测试问卷网页、51商城购商品详情网页、51商城购展示商品内容网页的制作。
-
●2.3超链接标签
本节课我们介绍了超链接标签和书签链接,并应用超链接标签实现51商城购主页到登录页面的跳转功能,应用书签实现51商城购手机页面中添加书签链接的功能。。
-
第三章CSS3样式表
CSS通常称为CSS样式或样式表,主要用于设置HTML页面中的文本内容(包括字体、大小、对齐方式等)、图片的外形(包括宽高、边框样式、边距等)以及版面的布局等外观显示样式。
-
●3.1CSS3样式表概述,引入样式表3种方式
CSS3样式表概述,引入样式表3种方式 引入CSS样式表的方式有3种,分别是:行内式、内嵌式和外链式。
-
●3.2基础选择器
要想将CSS样式应用于特定的HTML元素,首先需要找到该目标元素。在CSS中,执行这一任务的样式规则部分被称为选择器。CSS基础选择器有4种,分别是:标记选择器、类选择器、id选择器和通配符选择器。
-
●3.3CSS3中设置文本
使用CSS样式表来编辑网页的文本式样,使网页更加生动活泼。常用的CSS字体样式属性有5种。分别是font-size属性、font-family属性、font-weight属性、font-variant属性、font-style属性。
-
●3.4CSS3中设置文本外观属性
使用CSS样式表来设置文本的外观,属性设置有9种,通过文本外观设置提高网页文字美观效果。
-
●3.5CSS复合选择器
选择器可以灵活控住CSS样式表设置,使得网页开发更加高速快捷。CSS复合选择器有三种,分别是:标签指定式选择器、后代选择器、并集选择器。
-
●3.6背景设置
在CSS中,不仅可以将网页元素的背景设置为某一种颜色,还可以将图像作为网页元素的背景,背景颜色通过background-color属性实现,而背景图像通过background-image属性实现。
-
●3.7列表属性设置
list-style复合属性可以控制列表的显示样式,实际上,通常将list-style的属性值定义为none,清除列表的默认样式。应用背景图像定义列表项目符号。
-
●3.8超链接属性设置
定义超链接时,为了提高用户体验,经常需要为超链接指定不同的状态,使得超链接在单击前、单击后和鼠标悬停时的样式不同。在CSS中,通过链接伪类可以实现不同的链接状态。
-
●3.9盒模型概述
网页所有元素可以看作是盒子,通过盒子模型控制元素摆放位置。
-
●3.10边框设置
盒子模型的边框属性可以控制网页元素外边框式样和颜色等。
-
●3.11设置内边距和外边距
盒子模型的内边距控制内容与盒子边框之间的位置。盒子模型的外边距控制盒子与盒子之间的距离,使得网页元素更好的布局。
-
●3.12元素的类型与转换
网页元素分为块级元素和行内元素,不同元素显示模式不同,相互之间可以互相转换。
-
●3.13浮动
CSS 提供了 3 种机制来设置盒子的摆放位置,分别是普通流(标准流)、浮动和定位。浮动让盒子从普通流中浮起来,主要作用让多个块级盒子在一行显示
-
●3.14清除浮动
因为父级盒子很多情况下,不方便给高度,但是子盒子浮动就不占有位置,最后父级盒子高度为0,就影响了下面的标准流盒子。所以必要时需要清除浮动。
-
●3.15定位
在CSS中,通过定位属性可以实现网页中元素的精确定位。
-
●3.16综合练习-51商城购手机板块制作
CSS综合练习制作51商城购手机版块,全面练习CSS样式设置。
-
第四章第四章
表格与表单是HTML网页中的重要标签,利用表格可以对网页进行排版,使网页信息有条理地显示出来,而表单的出现则使网页从单向的信息传递发展到能够与用户进行交互对话,实现了网上注册、网上登录、网上交易等多种功能。
-
●4.1绘制表格,表格的结构及属性
在HTML语法中,表格一般通过三个标签儿来构建,分别为表格、标签、行标签和单元格标签。
-
●4.2<table>标记的属性
表格标签包含了大量属性,虽然大部分属性都可以使用CSS进行代替,但是HTML语言也为
标签儿提供了一系列的属性。
●4.3CSS样式设置表格
除了表格标签儿自带的属性外,还可以用css的边框、宽高、颜色等来控制表格的样式。此外,CSS中还提供了表格专用属性,以便控制表格样式。
●4.4表单
表单是可以通过网络接收其他用户数据的平台,例如注册页面的账户密码输入、网上订货页等都是以表单的形式来收集用户信息,并将这些信息传递给后台服务器,实现网页与用户间的沟通对话。
●4.5综表单input控件使用方法和属性
学习表单的核心就是学习表单控件,HTML语言提供了一系列表单空间,用于定义不同的表单功能。
●4.6input标签及属性
我们在浏览网页时,经常会看到单行文本输入框、单选按钮、复选框,提交按钮、重置按钮等,要想定义这些元素就需要使用input控件。标签儿为单标签儿,Type属性为其最基本的属性,其取值有多种,用于指定不同的控件类型。
●4.7文本域textare及属性
HTML雨夜提供了textare控件,通过textare控件可以轻松的创建多行文本输入框。
●4.8列表标签select及属性
在浏览网页时,我们经常会看到包含多个选项的下拉菜单,要想制作这种下拉菜单效果,就需要使用select标签。
●4.9综合案例:商城注册和登录页面
本章重点讲解了表格相关标记、表单相关标记以及CSS控制表格与表单的样式,为了使初学者更好的运用表格与表单组织页面,通过案例的形式分步骤,走制作网页中常见的注册/登录界面。
●4.10“千年之恋”案例
元素是表单中最常见的元素,网页中常见的单行文本框、单选按钮、复选按钮等都是通过它定义的。在HTML5中标记拥有多种输入类型及相关属性,通过学习应该掌握常用的表单控件及相关属性,并能够熟练地运用表单组织页面元素。
-
开始学习
-
第一章 作业测试第一章 网页设计基础
1.1 web网站初体验
1.2 hbuilder开发工具
1.3 html5基本结构
视频数3 -
第二章 作业测试第二章 HTML5标签
2.1 制作51商城购头部页面
2.2 列表标签
2.3 超链接标签
视频数16 -
第三章 作业测试第三章 CSS3样式表
3.1 CSS3样式表概述,引入样式表3种方式
3.2 基础选择器
3.3 CSS3中设置文本
3.4 CSS3中设置文本外观属性
3.5 CSS复合选择器
3.6 背景设置
3.7 列表属性设置
3.8 超链接属性设置
3.9 盒模型概述
3.10 边框设置
3.11 设置内边距和外边距
3.12 元素的类型与转换
3.13 浮动
3.14 清除浮动
3.15 定位
3.16 综合练习-51商城购手机板块制作
视频数16 -
第四章 作业测试第四章 第四章
4.1 绘制表格,表格的结构及属性
4.2 <table>标记的属性
4.3 CSS样式设置表格
4.4 表单
4.5 综表单input控件使用方法和属性
4.6 input标签及属性
4.7 文本域textare及属性
4.8 列表标签select及属性
4.9 综合案例:商城注册和登录页面
4.10 “千年之恋”案例
视频数12 -
期末考试