网页设计

萍乡学院 · 丽晶课件

目录

  • 1 网页设计概述
    • 1.1 网页设计概述
    • 1.2 网页开发工具
    • 1.3 浏览器开发者工具
    • 1.4 章节测试
  • 2 HTML结构基础篇
    • 2.1 Html标记与属性
    • 2.2 搭建章节作业站点
    • 2.3 章节测试
  • 3 CSS样式基础篇
    • 3.1 引入CSS样式表的四种方式
    • 3.2 CSS基础选择器
    • 3.3 CSS复合选择器
    • 3.4 章节测试
  • 4 CSS样式进阶篇
    • 4.1 制作“专题学习”模块效果1
    • 4.2 制作“专题学习”模块效果2
    • 4.3 精灵图技术_淘宝网首页局部效果
    • 4.4 章节测试
  • 5 网页布局技术
    • 5.1 模拟新浪微博发言版块布局1
    • 5.2 模拟新浪微博发言版块布局2
    • 5.3 模拟腾讯QQ网页视差效果
    • 5.4 章节测试
  • 6 超链接与导航栏
    • 6.1 超链接类型与基本语法
    • 6.2 锚点链接与图像热区链接
    • 6.3 制作纵向导航栏
    • 6.4 制作横向导航栏
    • 6.5 制作带下拉菜单的导航栏
    • 6.6 滑动门技术01_微信官网首页导航栏效果
    • 6.7 滑动门技术02_微信官网首页导航栏效果
    • 6.8 章节测试
  • 7 表格及样式设置
    • 7.1 创建表格
    • 7.2 表格的样式设置
    • 7.3 章节测试
  • 8 表单及样式设置
    • 8.1 表单基础
    • 8.2 Html5表单新属性
    • 8.3 Html5表单新元素
    • 8.4 章节测试
  • 9 JavaScript基础
    • 9.1 JavaScript基础
    • 9.2 焦点轮播图制作01
    • 9.3 焦点轮播图制作02
    • 9.4 焦点轮播图制作03
    • 9.5 跑马灯效果实现01
    • 9.6 跑马灯效果实现02
    • 9.7 章节测试
  • 10 感受Html5+CSS3魅力
    • 10.1 响应式设计与媒体查询
    • 10.2 CSS3动画_旋转的太极图01
    • 10.3 CSS3动画_旋转的太极图02
    • 10.4 HTML 5 Canvas 基础01
    • 10.5 HTML 5 Canvas 基础02
    • 10.6 章节测试
模拟腾讯QQ网页视差效果
  • 1 视频教程
  • 2 知识速递
  • 3 反馈作业

       同学们好，这节课我们通过模拟IMQQ网页视差效果案例的制作，学习CSS背景图的样式设置方法，本节的重点是掌握CSS背景图属性、背景重复属性、背景位置属性、背景附着属性和背景尺寸属性的应用，通过案例制作我们了解背景固定的关键是设置background-attachment属性值为fixed，另外我们在案例制作中还复习了网页素材的获取、块元素居中及块元素高度为百分之百等等常用技巧。准备好了吗，我们开讲了！