网页设计-CSS盒子.pptVIP

  1. 1、本文档共28页,可阅读全部内容。
  2. 2、原创力文档(book118)网站文档一经付费(服务费),不意味着购买了该文档的版权,仅供个人/单位学习、研究之用,不得用于商业用途,未经授权,严禁复制、发行、汇编、翻译或者网络传播等,侵权必究。
  3. 3、本站所有内容均由合作方或网友上传,本站不对文档的完整性、权威性及其观点立场正确性做任何保证或承诺!文档内容仅供研究参考,付费前请自行鉴别。如您付费,意味着您自己接受本站规则且自行承担风险,本站不退款、不进行额外附加服务;查看《如何避免下载的几个坑》。如果您已付费下载过本站文档,您可以点击 这里二次下载
  4. 4、如文档侵犯商业秘密、侵犯著作权、侵犯人身权等,请点击“版权申诉”(推荐),也可以打举报电话:400-050-0827(电话支持时间:9:00-18:30)。
  5. 5、该文档为VIP文档,如果想要下载,成为VIP会员后,下载免费。
  6. 6、成为VIP后,下载本文档将扣除1次下载权益。下载后,不支持退款、换文档。如有疑问请联系我们
  7. 7、成为VIP后,您将拥有八大权益,权益包括:VIP文档下载权益、阅读免打扰、文档格式转换、高级专利检索、专属身份标志、高级客服、多端互通、版权登记。
  8. 8、VIP文档为合作方或网友上传,每下载1次, 网站将根据用户上传文档的质量评分、类型等,对文档贡献者给予高额补贴、流量扶持。如果你也想贡献VIP文档。上传文档
查看更多

精选完整ppt课件*CSS布局基础Css盒子模型Css块状布局精选完整ppt课件*Css盒子CSS盒子是指具备内容(content)、填充(padding)、边框(border)、边界(margin),属性的模式。在CSS中所有的页面元素都可以看做“盒子”,一张网页就是由若干个盒子和盒子嵌套组成的。精选完整ppt课件*精选完整ppt课件*Css盒子精选完整ppt课件*精选完整ppt课件*HTML的元素类型块元素(block)是作为内容的独特块而显示的元素,它以新行开始和结束。pliuldivtablebrh1…h6内联元素(inline)内联元素没有开始行和结束行,在某一行中逐个出现,没有换行,水平放置在页面中。imgainput精选完整ppt课件*Css布局常用属性---display属性使用该属性可以改变页面元素的值。None:不显示任何内容Block:将元素指定为块元素Inline:将元素指定为内联元素精选完整ppt课件*Css布局常用属性---position属性使用该属性可以定位网页元素。static:静态定位,定位属性的默认值,元素按照html语法规则的自然属性定位。relative:相对定位(先对于页面的自然定位而言),具体位置由top、bottom、left、right属性联合制定。fixed:将元素按照浏览器窗口的左上角(或右下角)进行固定定位,具体位置由top、bottom、left、right属性联合制定。当用户滚动页面时,内容在此位置固定。Absolute:绝对定位,将元素定位到网页中的任何区域,具体位置由top、bottom、left、right属性联合制定。精选完整ppt课件*Css布局常用属性---float属性用于控制对象的浮动方式。none:静态定位,定位属性的默认值,元素按照html语法规则的自然属性定位。left:左浮动(先对于页面的自然定位而言),具体位置由top、bottom、left、right属性联合制定。right:右浮动精选完整ppt课件*DIV+CSS布局设计思路1.用div来定义语义结构,放置具体内容;2.用css来布局div和美化div内部的内容和外部样式。精选完整ppt课件*Css盒子实例电子相册导航条页面布局精选完整ppt课件*Css盒子实例—电子相册精选完整ppt课件*精选完整ppt课件*精选完整ppt课件*定义盛放图片的盒子div.box{margin:10px;border:1pxdotted#0000ff;padding-top:20px;padding-left:20px;height:120px;width:120px;float:right} 精选完整ppt课件*定义盛放文字的盒子div.desc{text-align:center;font-weight:normal;width:120px;margin:2px;}精选完整ppt课件*Css盒子实例—导航条精选完整ppt课件*导航条的盒子布局最外边一个大盒子(ul),这个盒子与1像素高的背景图片等宽;里面又有五个小盒子(li)分别装着每一个导航栏,导航栏这个盒子里面又装着一个稍小的盒子(a);这个盒子又装着一个黄色的修饰盒子(a的左边框,这里勉强理解为盒子,因为它不像一般的边框那么细,在网页中看起来像个盒子)和一个有文字的链接盒子(a的内容)。

精选完整ppt课件*精选完整ppt课件*Css盒子实例—布局网页精选完整ppt课件*精选完整ppt课件*

文档评论(0)

187****7859 + 关注
实名认证
文档贡献者

该用户很懒,什么也没介绍

1亿VIP精品文档

相关文档