第二章布局基础.ppt

第二章 布局基础 本章内容 盈利模式 如何构建有意义的内容结构 选择器 如何使用样式表 框模型（盒模型） 定位 几个常见布局 导航条 表单样式 两列和三列 零基础，能学会吗？ 一学生说有些课（面向对象程序设计）没有基础就不用去听课，这门课能学会吗？ 不需要基础 但需要坚持与训练 2.1 盈利模式 盈利模式 2009央视春晚零点报时4701万 盈利模式 广告（腾讯首页20万/天）媒体宣传 盈利模式 会员（阿里巴巴2800元/年） 盈利模式 网游：卖虚拟物品、点卡、游戏场景中广告 盈利模式 出版：400万/月，专业写手：150万/年 盈利模式 竞价：钢管11.31元/次 盈利模式 百度、谷歌、阿里妈妈广告投放 盈利模式 销售链接 盈利模式 信息（傲游） 盈利模式 与线下结合（团购） 盈利模式 销售服务（邮箱、SaaS软件、交易中价费） 盈利模式 移动增值 2.2 如何构建有意义的内容结构 文档结构 使用有意义的元素 h1、h2等 ul、ol、dl strong和em blockquote和cite abbr、acronym和code fieldset、legend和label caption、thead、tbody和tfoot ID和类名 元素并不全面，没有专用元素来表示每一内容，这样就必须在这些元素上设定一个额外的信息来表达这个元素所标识的内容 我们可能要这样显示两块内容 给每个容器加上标识就进行了区分 加下面这种标识好吗？ 类使用过多也不好 div和span div提供了将文档分割为有意义区域的方法 应该在没有现有元素能够实现区域分割的情况下使用div 有意义的页面结构 代码最简化 标识名称应说明内容而不是在页面中的布局，如mainNav说明是主导航，而没有规定主导航在页面中上面还是下面，实际实现过程中这几种位置都有可能出现。 2.3 选择器 类型选择器（元素选择器） 针对HTML元素应用样式 后代选择器 ID选择器和类选择器 伪类和通用选择器 2.4 应用样式 三种应用样式方法 在标签的style属性中添加样式（不建议） 写在一个页面的头部，只能当前页面使用（不建议） 写在单独文件中，所有文件都链接这个或这些文件（建议） 任务 查看你所熟悉的网站比较典型的几个页面的源代码，了解常见页面代码编写方法 分析腾讯公司盈利模式有哪些？ * 有四只杯子 1、如果我要求向杯子中放入水 你会向四只杯子放入水 2、如果说向1号杯子放水，2号杯子放牛奶（ID） 3、如果说向蓝色杯子放水，向绿色杯子放牛奶（类） ID在一个页面中必须是唯一的，标识页面中单独元素 类可以应用页面上任意数量的元素 未添加样式 添加样式后