- 1、本文档共421页,可阅读全部内容。
- 2、有哪些信誉好的足球投注网站(book118)网站文档一经付费(服务费),不意味着购买了该文档的版权,仅供个人/单位学习、研究之用,不得用于商业用途,未经授权,严禁复制、发行、汇编、翻译或者网络传播等,侵权必究。
- 3、本站所有内容均由合作方或网友上传,本站不对文档的完整性、权威性及其观点立场正确性做任何保证或承诺!文档内容仅供研究参考,付费前请自行鉴别。如您付费,意味着您自己接受本站规则且自行承担风险,本站不退款、不进行额外附加服务;查看《如何避免下载的几个坑》。如果您已付费下载过本站文档,您可以点击 这里二次下载。
- 4、如文档侵犯商业秘密、侵犯著作权、侵犯人身权等,请点击“版权申诉”(推荐),也可以打举报电话:400-050-0827(电话支持时间:9:00-18:30)。
查看更多
Web前端开发项目教程;项目01 认识网站和网页;任务01-1:网站设计与开发起步;一、基本概念-网页;基本概念-网页;基本概念-网站;基本概念-网站;基本概念-网站;二、Web标准;Web标准;Web标准——结构标准;Web标准——表现标准;Web标准——行为标准;实训任务;实训任务;任务01-2 制作第一个网页;任务01-2:制作第一个网页;一、常用HTML编辑器;一、常用HTML编辑器;一、常用HTML编辑器;二、在Hbuilder中新建网页;三、HTML5的文档结构;标签;!DOCTYPE声明;HTML文档头部标记head/head;title/title;meta /;meta /;link/;HTML文档主体标记body/body;h1~h6标题标记;p/p段落标记;HTML的树形文档结构;实训任务;项目02 网页的蓝图--简单布局;任务02-1 使用CSS装饰网页;一、DIV+CSS网页布局流程;二、CSS样式表;1. CSS样式表简介—样式规则;1. CSS样式表简介—层叠;1. CSS样式表简介—样式表的优点;2. 样式表分类;2.1内嵌样式表;2.1内嵌样式表; 如果希望一个网站中多个页面的样式保持一致,如何解决?;2.2外部样式表;2.2外部样式表;2.2外部样式表;2.2外部样式表;2.3内联样式表(行内样式);2.3内联样式表;实训任务;项目02 网页的蓝图—简单布局;任务02-2 巧用选择器调兵遣将;一、CSS选择器;二、基本选择器的用法——标记名选择器;二、基本选择器的用法——class类选择器; body
h2静夜思/h2
h3作者:李白/h3
p class=fir床前明月光,/p
p class=fir疑是地上霜。/p
p举头望明月,/p
p低头思故乡。/p
/body
/html;class类选择器; class类选择器的样式复用;二、基本选择器的用法——ID选择器; body
h2静夜思/h2
h3作者:李白/h3
p class=fir床前明月光,/p
p class=fir疑是地上霜。/p
p举头望明月,/p
p id=last低头思故乡。/p
/body
/html; ID选择器;结合元素选择器使用;三、扩展选择器的用法;3.1 后代选择器;3.1 后代选择器;3.2 子代选择器;3.2 子代选择器;3.3 交集选择器;3.3 交集选择器;3.4 并集选择器;3.5 通用选择器;实训任务;实训任务;项目02 网页的蓝图—简单布局;任务2-3 使用盒模型划分页面;一、页面元素的分类和转换;1.1 块级元素;1.2 行内元素;1.3 行内元素和块级元素的转换;二、块级元素的盒子模型;2.1 盒子的宽度和高度;宽度如何取值?;高度如何取值?;2.2 盒子的边框;2.2 盒子的边框;2.2 盒子的边框;圆角边框的设置;圆角边框的设置;;2.3 盒子的内填充属性;2.3 盒子的内填充属性;;2.4 盒子的外边距属性;盒子的居中;实训任务1;实训任务2;2.5 盒子的背景;设置背景颜色;设置背景图片;设置样式背景图片如何重复;设置样式背景图片位置;背景图片位置示例;背景图片位置示例;设置背景图片不随滚动条移动;设置背景图片的尺寸;设置背景图片的定位区域;实训任务3;2.6 盒子的阴影效果;2.6 盒子的阴影效果;多阴影效果;2.7 盒子的占位;默认模式:content-box;IE怪异模式:border-box;IE怪异模式:border-box;项目02 网页的蓝图—简单布局;任务2-4 BFC布局;一、垂直外边距的合并;一、垂直外边距的合并;二、BFC布局——规则;二、BFC布局——触发BFC;BFC解决外边距合并问题;解决方案1. 使用overflow属性触发BFC。;解决方案2.使用display属性值触发BFC。;实训任务;项目03 网页的蓝图—复杂布局;任务3-1 浮动布局两栏式页面;一、认识浮动;二、元素的浮动属性float;2.1 不设置浮动;2.2 设置浮动;三、清除浮动;三、清除浮动;四、盒子的高度塌陷及解决方法;四、盒子的高度塌陷及解决方法;4.1 使用空标记清除浮动;4.2 使用after伪对象清除浮动;4.3 使用overflow属性清除浮动;实训任务1 网页元素的水平排版;实训任务2;项目03 网页的蓝图—复杂布局;任务3-2 DIV+CSS布局网上商城首页;一、网页布局的流程;一、网页布局的流程;二、常见网页布局——单栏式布局;二、常见网页布局——两栏式布局;二、常见网页布局——通栏多列式布局;二、常见网页布局——通栏多列式布局;二、常见网页布局——通栏多列式布局;实训任务:完成网上
您可能关注的文档
- MG动画设计与制作配套教材电子课件(完整版).pptx
- Premiere Pro CC 2019视频编辑配套教材电子课件(完整版).pptx
- Python数据分析与挖掘实战配套教材电子课件(完整版).pptx
- Python网络爬虫基础教程配套教材电子课件(完整版).pptx
- UI界面设计与制作(全彩慕课版)配套教材电子课件(完整版).pptx
- 财经法规与会计职业道德(第五版)配套教材电子课件(完整版).pptx
- 财政管理配套教材电子课件(完整版).pptx
- 采购实务配套教材电子课件(完整版).pptx
- 大数据财务分析 – 基于Python配套教材电子课件(完整版).pptx
- 电机与拖动(第4版)配套教材电子课件(完整版).pptx
最近下载
- 《大学之道》《人皆有不忍人之心》(成语识记+挖空特训+情境默写+写作素材) 统编新教材高考语文课内古诗文【要点梳理与素材积累】.docx VIP
- 五年级道德与法治3,主动拒绝烟酒与毒品优秀教案.pdf
- 《美丽的丝巾ppt课件》小学美术浙人美版二年级下册_2.ppt
- 《论语十二章》(成语识记+挖空特训+情境默写+写作素材) 统编新教材高考语文课内古诗文【要点梳理与素材积累】.docx VIP
- 电动单梁起重机设计计算书.doc
- 2069-3-3101-002 WKB产品判定准则-外发.docx
- 露天矿组织架构、部门职责.pdf VIP
- 《数字化测图》课程标准(高职).docx
- 医疗行业医疗设备采购方案.docx VIP
- 朝阳市第四高中诗词大会十二宫格题.ppt
文档评论(0)