04 2016 档案
摘要：学习要点： 1.表格样式 2.列表样式 3.其他功能 主讲教师：李炎恢 本章主要探讨 HTML5 中 CSS 表格和列表，通过表格和列表的样式设置，让表格和列表显示更加多元化。 一．表格样式 表格有五种独有样式，样式表如下： 1.border-collapse table { border-coll
阅读全文
摘要：学习要点： 1.设置背景 主讲教师：李炎恢 本章主要探讨 HTML5 中 CSS 边框和背景，通过边框和背景的样式设置，给元素增加更丰富的外观。 一．设置背景 盒模型的尺寸可以通过两种方式实现可见性，一种就是之前的边框，还有一种就是背景。 CSS 背景设置的样式表如下： 属性 说明 CSS 版本 b
阅读全文
摘要：学习要点： 1.声明边框 2.边框样式 3.圆角边框 主讲教师：李炎恢 本章主要探讨 HTML5 中 CSS 边框和背景，通过边框和背景的样式设置，给元素增加更丰富的外观。 一．声明边框 边框的声明有三个属性设置，样式表如下： 属性 值 说明 CSS 版本 border-width 长度值 设置边框
阅读全文
摘要：学习要点： 1.元素可见性 2.元素盒类型 3.元素的浮动 主讲教师：李炎恢 本章主要探讨 HTML5 中 CSS 盒模型，学习怎样了解元素的外观配置以及文档的整体布局。 一．元素可见性 使用 visibility 属性可以实现元素的可见性，这种样式一般可以配合 JavaScript 来实现效果。样
阅读全文
摘要：学习要点： 1.元素尺寸 2.元素内边距 3.元素外边距 4.处理溢出 主讲教师：李炎恢 本章主要探讨 HTML5 中 CSS 盒模型，学习怎样了解元素的外观配置以及文档的整体布局。 一．元素尺寸 CSS 盒模型中最基础的就是设置一个元素的尺寸大小。有三组样式来配置一个元素的尺寸大小，样式表如下：
阅读全文
摘要：学习要点： 1.文本总汇 2.文本样式 3.文本控制 主讲教师：李炎恢 本章主要探讨 HTML5 中 CSS 文本样式，通过文本样式的设置，更改字体的大小、样式以及文本的方位。 一．文本总汇 本节课，我们重点了解一下 CSS 文本样式中文本内容的一些设置方法，样式表如下： 属性名 说明 CSS 版本
阅读全文
摘要：学习要点： 1.字体总汇 2.字体设置 3.Web 字体 主讲教师：李炎恢 本章主要探讨 HTML5 中 CSS 文本样式，通过文本样式的设置，更改字体的大小、样式以及文本的方位。 一．字体总汇 本节课，我们重点了解一下 CSS 文本样式中字体的一些设置方法，样式表如下： 属性名 说明 CSS 版本
阅读全文
摘要：学习要点： 1.颜色表方案 2.度量单位 主讲教师：李炎恢 本章主要探讨 HTML5 中 CSS 颜色和度量单位等问题，包括颜色的选取方式、相对长度和绝对长度等。 一．颜色表方案 颜色的表现形式主要有三种方式：颜色名称、十六进制代码和十进制代码。 p { color: red; } 解释：这是将一个
阅读全文
摘要：学习要点： 1.选择器总汇 2.基本选择器 3.复合选择器 4.伪元素选择器 主讲教师：李炎恢 本章主要探讨 HTML5 中 CSS 选择器，通过选择器定位到想要设置样式的元素。目前 CSS 选择器的版本已经升级至第三代，即 CSS3 选择器。CSS3 选择器提供了更多、更丰富的选择器方式，主要分为
阅读全文
摘要：学习要点： 1.使用 CSS 2.三种方式 3.层叠和继承 主讲教师：李炎恢 本章主要探讨 HTML5 中 CSS（层叠样式表），它是用来对 HTML 文档外观的表现形式进行排版和格式化。 一．使用 CSS CSS 样式由一条或多条以分号隔开的样式声明组成。每条声明的样式包含着一个 CSS 属性和属
阅读全文
摘要：学习要点： 1.实体 2.元数据 3.全局属性 主讲教师：李炎恢 本章主要探讨 HTML5 中的 HTML 实体、以及 HTML 核心构成的元数据，最后了解一下 HTML 中的全局属性。 一．实体 HTML 实体就是将有特殊意义的字符通过实体代码显示出来。 二．元数据 <meta>元素可以定义文档中
阅读全文
摘要：学习要点： 1.其他元素 2.输入验证 主讲教师：李炎恢 本章主要探讨 HTML5 中表单中剩余的其他元素，然后重点了解一下表单的输入验证功能。 一．其他元素 表单元素还剩下几个元素没有讲解，包括下拉框列表 select、多行文本框 textarea、和 output 计算结果元素。 元素名称 说明
阅读全文
摘要：学习要点： 1.type 属性总汇 2.type 属性解析 主讲教师：李炎恢 本章主要探讨 HTML5 中表单中 input 元素的 type 属性，根据不同的值来显示不同的输入框。 一．type 属性总汇 input 元素可以用来生成一个供用户输入数据的简单文本框。在默认的情况下，什么样的数据均可
阅读全文
摘要：学习要点： 1.表单元素总汇 2.表单元素解析 主讲教师：李炎恢 本章主要探讨 HTML5 中表单元素，表单元素用于获取用户的输入数据。 一．表单元素总汇 在 HTML5 的表单中，提供了各种可供用户输入的表单控件。 元素名称 说明 form 表示 HTML 表单 input 表示用来收集用户输入数
阅读全文
摘要：学习要点： 1.音频和视频概述 2.video 视频元素 3.audio 音频元素 主讲教师：李炎恢 本章主要探讨 HTML5 中音频和视频元素，通过这两个原生的媒体元素向 HTML 页面中嵌入音频和视频。 一．音频和视频概述 首先，我们要理解两个概念：容器（container）和编解码器(code
阅读全文
摘要：学习要点： 1.嵌入元素总汇 2.嵌入元素解析 主讲教师：李炎恢 本章主要探讨 HTML5 中嵌入元素，嵌入元素主要功能是把外部的一些资源插入到HTML 中。 一．嵌入元素总汇 这里所列出的元素，并非本节课全部涉及到，比如音频 audio、视频 video、以及动态图像 canvas 和媒体资源 s
阅读全文
摘要：学习要点： 1.文档元素总汇 2.文档元素解析 主讲教师：李炎恢 本章主要探讨 HTML5 中文档元素，文档元素的主要作用是划分各个不同的内容，让整个布局清晰明快。让整个布局元素具有语义，进一步替代 div。 一．文档元素总汇文档元素基本没有什么实际作用效果，主要目的是在页面布局时区分各个主题和概念
阅读全文
摘要：学习要点： 1.表格元素总汇 2.构建表格解析 主讲教师：李炎恢 本章主要探讨 HTML5 中表格元素的用法。表格的主要用途是以网格的形式显示二维数据。 一．表格元素总汇 表格的基本构成最少需要三个元素：<table>、<tr>、<td>，其他的一些作为可选辅助存在。 元素名称 说明 table 表
阅读全文
摘要：学习要点： 1.分组元素总汇 2.分组元素解析 主讲教师：李炎恢 本章主要探讨 HTML5 中分组元素的用法。所谓分组，就是用来组织相关内容的 HTML5 元素，清晰有效的进行归类。 一．分组元素总汇为了页面的排版需要，HTML5 提供了几种语义的分组元素。 元素名称 说明 p 表示段落 div 一
阅读全文
摘要：学习要点： 1.超链接的属性 2.相对与绝对路径 3.锚点设置 主讲教师：李炎恢 本章主要探讨 HTML5 中文本元素最重要的一个超链接，探讨它自身的属性以及路径问题。 一．超链接的属性 <a>元素属于文本元素，有一些私有属性或者叫局部属性。那么，相对应的还有通用属性或叫做全局属性。这方面的知识，后
阅读全文
摘要：学习要点： 1.文本元素总汇 2.文本元素解析 主讲教师：李炎恢 本章主要探讨 HTML5 中的文本元素，所谓文本元素，就是将一段文本设置成相匹配的结构和含义。 一．文本元素总汇 HTML5 规范指出：使用元素应该完全从元素的语义出发。但是由于历史遗留及用户至上的原则，这种语义会宽松许多。 元素名称
阅读全文
摘要：学习要点： 1.HTML5 文档结构 2.文档结构解析 3.元素标签探讨 主讲教师：李炎恢 本章主要先从 HTML5 的文档结构谈起。 这些基础元素确定了 HTML 文档的轮廓以及浏览器的初始环境。几乎所有页面都必须首先键入这些元素。 一．HTML5 文档结构 1.第一步：打开 Sublime Te
阅读全文
摘要：学习要点： 1.HTML5 的历史 2.HTML5 的功能 3.HTML5 的特点 4.课程学习问题 主讲教师：李炎恢 HTML5 是继 HTML4.01 和 XHTML1.0 之后的超文本标记语言的最新版本。 它是由一群自由思想者组成的团队设计出来，并最终实现多媒体支持、交互性、更加智能的表单，以
阅读全文
摘要：学习要点： 1.案例内容 2.关于内容 主讲教师：李炎恢 本节课我们制作一下子案例栏目和关于栏目。 一．案例内容 //案例内容 1-4 个根据不同显示比例展示 //CSS 部分 二．关于栏目 //左右两栏即可 //CSS 部分
阅读全文
摘要：学习要点： 1.资讯内容 主讲教师：李炎恢 本节课我们制作一下子栏目资讯内容。 一．资讯内容 //谷歌浏览器解析的顺序调整，需要全部加载后执行 注：对于 Firefox 浏览器，可以按 Ctrl+Shift+M，调整移动端尺寸。 //子栏目标题 //栏目 CSS //资讯内容 //资讯内容 CSS
阅读全文
摘要：学习要点： 1.首页内容介绍[下] 主讲教师：李炎恢 本节课我们制作一下首页内容介绍的下半部分。 一．首页内容介绍[下] //先完成底部的 footer //底部 CSS //两段内容 //CSS 部分 //JS 控制垂直居中
阅读全文
摘要：学习要点： 1.首页内容介绍[上] 主讲教师：李炎恢 本节课我们轮播图的下方，设计一个内容介绍，内容介绍分两部分，本次为上半部分。 一．首页内容介绍[上] //关于上节课轮播图，手册上其实有一个更好的方案，并不需要通过额外的代码控制。 //内容介绍上 //对应的 CSS 部分
阅读全文
摘要：学习要点： 1.响应式轮播图 主讲教师：李炎恢 本节课我们要在导航条的下方做一张轮播图，自动播放最新的重要动态。 一．响应式轮播图 //响应式轮播图 //所需要的 jQuery 控制 //调整轮播器箭头位置 //所需要的 CSS
阅读全文
摘要：学习要点： 1.响应式导航 主讲教师：李炎恢 本节课我们开始设计第一个项目， 一个内训公司的企业网站， 本节课学习响应式导航部分。 一．响应式导航 //基本导航组件+响应式
阅读全文
摘要：学习要点： 1.附加导航插件 主讲教师：李炎恢 本节课我们主要学习一下 Bootstrap 中的附加导航插件。 一．附加导航 附加导航即粘贴在屏幕某处实现锚点功能。 //基本实例 //导航的 CSS 部分 //JavaScript 代替 data-spy="affix" data-offset-to
阅读全文
摘要：学习要点： 1.轮播插件 主讲教师：李炎恢 本节课我们主要学习一下 Bootstrap 中的轮播插件。 一．轮播 轮播插件就是将几张同等大小的大图，按照顺序依次播放。 //基本实例。 data 属性解释： 1.data-slide 接受关键字 prev 或 next，用来改变幻灯片相对于当前位置的位
阅读全文
摘要：学习要点： 1.按钮 2.折叠 主讲教师：李炎恢 本节课我们主要学习一下 Bootstrap 中的按钮和折叠插件。 一．按钮 可以通过按钮插件创建不同状态的按钮。 //单个切换。 注：在 Firefox 多次页面加载时，按钮可能保持表单的禁用或选择状态。解决方案是：添加 autocomplete="
阅读全文
摘要：学习要点： 1.弹出框 2.警告框 主讲教师：李炎恢 本节课我们主要学习一下 Bootstrap 中的弹出框和警告框插件。 一．弹出框 弹出框即点击一个元素弹出一个包含标题和内容的容器。 //基本用法 //JavaScript 初始化 弹出框插件有很多属性来配置提示的显示，具体如下： 通过 Java
阅读全文
摘要：学习要点： 1.标签页 2.工具提示 主讲教师：李炎恢 本节课我们主要学习一下 Bootstrap 中的标签页和工具提示插件。 一．标签页 标签页也就是通常所说的选项卡功能。 //基本用法 //可以设置淡入淡出效果 fade，而 in 表示首选的内容默认显示 //也可以换成胶囊式 //data-ta
阅读全文
摘要：学习要点： 1.下拉菜单 2.滚动监听 主讲教师：李炎恢 本节课我们主要学习一下 Bootstrap 中的下拉菜单插件， 这个插件在以组件的形式我们已经学习过，那么现在来看看怎么和 JavaScript 交互的。 一．下拉菜单 常规使用中，和组件方法一样，代码如下： //声明式用法 声明式用法的关键
阅读全文
摘要：学习要点： 1.基本使用 2.用法说明 主讲教师：李炎恢 本节课我们主要学习一下 Bootstrap 中的模态框插件， 这是一款交互式网站非常常见的弹窗功能插件。 一．基本使用 使用模态框的弹窗组件需要三层 div 容器元素，分别为 modal(模态声明层)、 dialog(窗口声明层)、conte
阅读全文
摘要：学习要点： 1.列表组组件 2.面板组件 3.响应式嵌入组件 主讲教师：李炎恢 本节课我们主要学习一下 Bootstrap 的三个组件功能：列表组组件、面板组件、 响应式嵌入组件。 一．列表组组件 列表组组件用于显示一组列表的组件。 //基本实例 //列表项带勋章 //链接和首选 //按钮式列表 /
阅读全文
摘要：学习要点： 1.Well 组件 2.进度条组件 3.媒体对象组件 主讲教师：李炎恢 本节课我们主要学习一下 Bootstrap 的三个组件功能：Well 组件、进度条组件、媒体对象组件。 一．Well 组件 这个组件可以实现简单的嵌入效果。 //嵌入效果 //有 lg 和 sm 两种可选值 二．进度
阅读全文
摘要：学习要点： 1.巨幕组件 2.页头组件 3.缩略图组件 4.警告框组件 主讲教师：李炎恢 本节课我们主要学习一下 Bootstrap 的四个组件功能：巨幕组件、页头组件、缩略图组件和警告框组件。 一．巨幕组件 巨幕组件主要是展示网站的关键性区域。 //在固定的范围内，有圆角 //100%全屏，没有圆
阅读全文
摘要：学习要点： 1.路径组件 2.分页组件 3.标签组件 4.徽章组件 主讲教师：李炎恢 本节课我们主要学习一下 Bootstrap 的四个组件功能：路径组件、分页组件、标签组件和徽章组件。 一．路径组件 路径组件也叫做面包屑导航。 //面包屑导航 二．分页组件 分页组件可以提供带有展示页面的功能。 /
阅读全文
摘要：学习要点： 1.输入框组件 2.导航组件 3.导航条组件 主讲教师：李炎恢 本节课我们主要学习一下Bootstrap的两个个组件功能： 输入框组件和导航导航条组件。 一．输入框组件 文本输入框就是可以在<input>元素前后加上文字或按钮，可以实现对表单控件的扩展。 //在左侧添加文字 //在右侧添
阅读全文
摘要：学习要点： 1.小图标组件 2.下拉菜单组件 3.按钮组组件 4.按钮式下拉菜单 主讲教师：李炎恢 本节课我们主要学习一下 Bootstrap 的三个组件功能：小图标组件、下拉菜单组件和各种按钮组件。 一．小图标组件 Bootstrap 提供了免费的 263 个小图标（数了两次），具体可以参考中文官
阅读全文
摘要：学习要点： 1.辅组类 2.响应式工具 主讲教师：李炎恢 本节课我们主要学习一下 Bootstrap 的辅组类和响应式工具， 辅助类提供了一组类来辅组页面设计，而响应式工具则利用媒体查询显示或隐藏某些内容。 一．辅助类 Bootstrap 在布局方面提供了一些细小的辅组样式，用于文字颜色以及背景色的
阅读全文
摘要：学习要点： 1.移动设备优先 2.布局容器 3.栅格系统 主讲教师：李炎恢 本节课我们主要学习一下 Bootstrap 的栅格系统，提供了一套响应式、移动设备优先的流式栅格系统。 一．移动设备优先 在 HTML5 的项目中，我们做了移动端的项目。它有一份非常重要的 meta，用于设置屏幕和设备等宽以
阅读全文
摘要：学习要点： 1.表单 2.图片 主讲教师：李炎恢 本节课我们主要学习一下 Bootstrap 表单和图片功能，通过内置的 CSS 定义，显示各种丰富的效果。 一．表单 Bootstrap 提供了一些丰富的表单样式供开发者使用。 1.基本格式 //实现基本的表单样式 注：只有正确设置了输入框的 typ
阅读全文
摘要：学习要点：1.表格2.按钮 主讲教师：李炎恢 本节课我们主要学习一下 Bootstrap 表格和按钮功能，通过内置的 CSS 定义，显示各种丰富的效果。 一．表格Bootstrap 提供了一些丰富的表格样式供开发者使用。1.基本格式//实现基本的表格样式 注：我们可以通过 Firebug 查看相应的
阅读全文
摘要：学习要点：1.页面排版 主讲教师：李炎恢 本节课我们主要学习一下 Bootstrap 全局 CSS 样式中的排版样式，包括了标题、页面主体、对齐、列表等常规内容。 一．页面排版Bootstrap 提供了一些常规设计好的页面排版的样式供开发者使用。1.页面主体Bootstrap 将全局 font-si
阅读全文
摘要：学习要点：1.Bootstrap 概述2.Bootstrap 特点3.Bootstrap 结构4.创建第一个页面5.学习的各项准备 主讲教师：李炎恢 本节课我们主要了解一下 Boostrap 历史、特点、用途，以及为什么选择 Boostrap 来开发我们的 Web 项目。 一．Bootstrap 概
阅读全文
