内容简介
HTML5、CSS3与jQuery俨然成为了标准Web制作技术的黄金组合。《HTML5+CSS3+jQuery应用之美》由韩国专业视觉设计师倾力奉献其多年商业网站设计与制作的从业经验,通过八大商业案例,以HTML5搭建结构、CSS3设置样式、jQuery实现动态应用这三者相结合的实际应用方式,详细讲解它们的新技术点,以及流行应用热点的设计思路与制作方法。技术核心穿插在实际操作中阐述,更便于读者在了解技术理论的同时明晰其应用本质。《HTML5+CSS3+jQuery应用之美》案例完整,跟学书中实例后,相信会使读者的网页设计与制作水平均有实质提升。
《HTML5+CSS3+jQuery应用之美》适合Web设计人员和前端开发人员阅读,也适合作为相关培训用途的参考用书。
作者简介
Yamoo,视觉设计师,酷爱网页设计,热衷于网页前端程序开发,喜爱使用Web标准平台技术设计UI,也喜欢尝试新鲜的事物,学习新的知识与技术。他常年讲授网页制作相关课程,并为新韩银行、每日乳业、韩国网络专家协会(Kipfa)举办Web设计讲座。现在monod.co.kr从事培训工作,并运营网页工程社区,积极交流,不断积累教学与技术经验反馈给读者。
目录
- 第1章 搭建网页开发环境
- 客户与主机
- 搭建Web客户测试环境
- 选择与安装网页制作工具
- 搭建Web主机环境
- 选择内容管理系统(CMS)
- 第2章 HTML5、CSS3、jQuery基础
- 超文本标记语言,HTML5基础
- 创建HTML5基本文档
- 编写正文主体:列表
- HTML5大纲算法(Outliner)与Section元素
- 层叠样式表,CSS3基础
- 控制正文主体(body)样式
- 控制标题(h1,h2)样式
- 控制网页背景与字体
- 脚本语言JavaScript基础
- JavaScript Library,jQuery基础
- 第3章 设计网页动态横幅广告(Banner)
- 设计效果预览
- 设计网页布局
- 编写HTML5代码
- 输入单击Banner时要链接的网站
- 向Banner中添加图片与文字
- 使用class属性标识各元素
- 编写CSS3样式表
- 控制body样式
- 控制Banner样式
- 向Banner插入背景图片
- 设置横幅广告的Logo图像
- 向Banner上的文字应用字体
- 设置Banner文字的位置与颜色
- 设计鼠标指针未移动到Banner上的Banner
- 使用jQuery播放声音
- 浏览器兼容性检查
- 第4章 设计气泡悬浮框
- 设计效果预览
- 设计网页布局
- 编写HTML5代码
- 编写CSS3样式表
- 控制body样式
- 设置标题字体样式
- 控制图片样式
- 控制气泡悬浮框1:基本样式
- 控制气泡悬浮框2:位置
- 控制气泡悬浮框3:添加圆角与尾巴
- 控制气泡悬浮框4:制作Transition动画
- 使用jQuery实现淡入/淡出效果
- 检查是否支持CSS3的transitio 属性
- 使用jQuery实现淡入/淡出效果
- 第5章 制作Lava Lamp滑动导航条
- 设计效果预览
- 设计网页布局
- 编写HTML 5代码
- 编写CSS3样式表
- 控制body样式
- 控制标题样式:应用英文网页字体
- 控制导航条边框样式
- 控制导航条菜单项样式
- 控制导航条样式:渐变
- 指定默认激活的菜单项
- 编写jQuery脚本代码
- 声明变量与引用文档对象
- 控制lava样式
- 设置lava的位置
- 向lava应用渐变
- 调整lava的位置
- 事件监听与处理
- 创建命名空间(Namespace)
- 制作插件
- 第6章 制作气泡动画按钮
- 设计效果预览
- 网页布局设计
- 编写HTML5代码
- 编写CSS3样式表
- 控制body样式
- 向body添加彩虹渐变
- 从CSS代码中提取重复代码,使用LESS重写
- 创建LESS函数
- 控制buttons_wrap样式
- 向jQuery按钮添加声音插件
- 第7章 设计带动画的选项卡菜单
- 设计效果预览
- 设计网页布局
- 编写HTML5代码
- 兼容IE 8之前版本的代码
- 应用Web字体与调用外部文件
- 编写网页结构代码
- 编写CSS3与LESS样式代码
- 控制基本样式
- 向整个选项卡区域与标题指定样式
- 控制选项卡样式
- 选项卡区域样式控制1:不支持JavaScript脚本的情形
- 选项卡区域样式控制2:支持JavaScript脚本的情形
- 编写jQuery插件
- 编写使用插件的脚本文件
- 编写插件
- 第8章 制作动态表格
- 设计效果预览
- 设计网页布局
- 编写HTML5表格代码
- 编写基本结构
- 编写表单代码
- 编写CSS3与LESS样式代码
- 编写基本样式控制代码
- 为整个表单区域(容器元素)编写样式代码
- 设置标题样式
- 控制表单元素样式1:标签与输入文本框
- 控制表单元素样式2:用户使用条款与信息收集
- 控制表单元素样式3:向输入文本框左侧添加图标
- 控制表单元素样式4:提交按钮
- 使用jQuery编写脚本代码
- 第9章 使用HTML5制作视频播放器
- 设计效果预览
- 设计网页布局
- 编写HTML5视频播放器
- 编写基本的HTML代码
- 编写JavaScript脚本自动生成的代码
- 编写jQuery视频播放插件
- 调用插件&设置初始值
- 建视频播放器容器元素
- 编写视频控件动态生成代码
- 设置视频控件按钮
- 设置视频播放进度条
- 制作播放进度条的滑块
- 编写播放条状态更新函数
- 编写声音控制滑块
- 为声音调节按钮编写函数
- 编写CSS3与LESS样式代码
- 基本样式控制
- 为视频容器编写样式代码
- 视频控件样式1:整体
- 视频控件样式2:播放按钮
- 视频控件样式3:播放进度条
- 视频控件样式4:计时器
- 视频控件样式5:声音控件
- 视频控件样式6:声音调节条
- 设置播放控制条到视频内部,并改变颜色
- 第10章 制作设备感应型网页
- 设计效果预览
- 设计网页布局
- 编写HTML5网页代码
- header(logo与导航)与header bar
- contents区域
- 编写CSS3与LESS样式代码
- 设置基本环境(下载normalize。css)
- 编写response.css框架
- 桌面显示样式1:基本样式
- 桌面显示样式2:header
- 桌面显示样式3:header bar
- 桌面显示样式4:contents
- 桌面显示样式5:footer
- 桌面显示样式6:设置拖选区域的背景色与文字颜色
- 为平板电脑编写显示样式
- 为智能手机编写显示样式
- 使用JavaScript编写固定的导航菜单插件