htmlcssdiv实现整体布局

《htmlcssdiv实现整体布局》由会员上传分享，免费在线阅读，更多相关内容在应用文档-天天文库。

1、HTMLCSS+DIV实现整体布局1、技术目标：·开发符合W3C标准的Web页面·理解盒子模型·实现DIV+CSS整体布局2、什么是W3C标准？   W3C：WorldWideWebConsortium，万维网联盟   W3C的职能：负责制定和维护Web行业标准   W3C标准包括一系列的标准：·HTML内容方面：XHTML·样式美化方面：CSS ·结构文档访问方面：DOM·页面交互方面：ECMAScript·……等等3、W3C倡导的Web结构要符合以下要求：·XHTML负责内容组织·CSS负责页面样式4、符合W3C规范页面

2、的结构：   Html代码  1. 3.     4.     5.        

3、           charset=gb2312"/> 2.         3.     4.     5.           ......页面内容部分 6.     7.     [html] viewplaincopy1.

4、/DTD/xhtml1-transitional.dtd">  3.      4.      5.          7.          8.      9.      10.   

5、         ......页面内容部分  11.      12.      5、XHTML基本规范1.标签名和属性名称必须小写2.HTML标签必须关闭3.属性值必须用引号括起来4.标签必须正确嵌套5.文档必须拥有一个根元素，所有的XHTML元素必须嵌套于根元素中6.属性不能简写，如：                                                

6、                  6、页面开发需要注意的地方：·不要使用淘汰的标签：、、等，可参考官方文档(http://www.w3c.org)·标签的alt属性：为图片增加alt属性·样式和内容分离：将样式和结构分离，不使用行类样式·表单的name和id：表单及表单元素要求设置name和id属性·使用CSS+DIV布局·页面的浏览器兼容性7、为什么需要盒子模型？   网页可以看成由一个个"盒子"组成，如图：     

7、  由上图可以看出，页面分为上(网站导航)、中、下(版权声明)三个部分，   中间部分又分为左(商品分类)、中(主要部分)、右，这些版块就像一个个   的盒子，这些"盒子"中放置着各种内容，页面就是由这些"盒子"拼凑起来8、盒子模型的相关属性·margin（外边距/边界）·border（边框）·padding（内边距/填充）    我们看图理解一下各属性作用：         以上属性又分为上、右、下、左四个方向          问题：页面元素的宽度width、高度height如何计算？    答案：元素的实际占位尺寸=元

8、素尺寸+padding+边框宽度    比如：元素实际占位高度=height属性+上下padding+上下边框宽度9、盒模型的层次关系   我们通过一个经典的盒模型3D立体结构图来理解，如图：         从上往下看，层次关系如下：    第1层：盒子的边框(border)，    第

当前文档最多预览五页，下载文档查看全文

侵权申诉 举报

此文档下载收益归作者所有

下载文档

当前文档最多预览五页，下载文档查看全文

点击下载本文档

• 版权提示
• 下载文档

举报

温馨提示：
1. 部分包含数学公式或PPT动画的文件，查看预览时可能会显示错乱或异常，文件下载后无此问题，请放心下载。
2. 本文档由用户上传，版权归属用户，天天文库负责整理代发布。如果您对本文档版权有争议请及时联系客服。
3. 下载前请仔细阅读文档内容，确认文档内容符合您的需求后进行下载，若出现内容与标题不符可向本站投诉处理。
4. 下载文档时可能由于网络波动等原因无法下载或下载错误，付费完成后未能成功下载的用户请联系客服处理。

相关文章

更多

• 模具的整体结构布局概述
• 整体厨柜常见的布局形式
• 茶楼装修设计的整体布局
• 整体实验室布局设计
• mCRC优化布局整体治疗策略
• mcrc优化布局整体治疗策略
• 展馆整体布局设计
• 论文整体布局
• 园林各要素的整体布局
• 中考作文—整体布局.ppt

相关标签

布局 整体 实现