1 / 15
文档名称:

Div CSS.ppt

格式:ppt   大小:51KB   页数:15页
下载后只包含 1 个 PPT 格式的文档,没有任何的图纸或源代码,查看文件列表

如果您已付费下载过本站文档,您可以点这里二次下载

Div CSS.ppt

上传人:drp539606 2019/2/3 文件大小:51 KB

下载得到文件列表

Div CSS.ppt

相关文档

文档介绍

文档介绍:Div+CSSCSS网页布局与定位丧贱隔呈轻奈彰炔插氢腑率洁戮策嗓弱柑茄陈深殃山跌抵诡挛难邱扔灵况Div+CSSDiv+CSSdivdiv是一个容器,XHTML页面中所有的标签都是容器;div中可以放入文本、其他标签,以及多个div标签嵌套使用;div标签中不可以出现“align”“style”等属性,标签代码只可以有以下两种格式:<divid=“id_name”>[...]</div><divclass=“class_name”>[...]</div>蔽窑弹扔煞逼歼悉埔缎李片库义哉阵脉桶俩淆帚范莲给仓遵润么早适霍扫Div+CSSDiv+CSSdivdiv本身在网页中表现为占据一整行,不允许与其他对象共存于一行中;div是一个block对象——块对象;<div>左边栏</div><div>右边栏</div>Eg01div本身与样式没有任何关系,样式需要通过编写CSS来实现。所以,div对象从本质上实现了与内容与样式的分离。及张攒忍捅陪衫撕螟世疲鹤烙贯晾栓倡蘸额吧忠渡诫谱材置讣幕勇帜盔鼻Div+CSSDiv+CSSdiv嵌套div结构<divid=“header”>头部</div><divid=“center”><divid=“left”>左分栏</div><divid=“right”>右分栏</div></div><divid=“footer”>底部</div>headerheaderleftright锰梢狼尺苑骏茵观诌圈烤谊禽宽臆保苗镇钉忿唤慢蕴昆戳冷键北瑞砧被屑Div+CSSDiv+CSSdiv使用合适对象布局——“滥用div”<divid=“header”><divid=“title”>标题区</div><divid=“nav”>导航</div></div><divid=“header”><h1>标题区</h1><ul>导航</ul></div>尽量少的使用div嵌套,可以减少浏览器解析嵌套关系的消耗。同时,简单的嵌套结构利于对版式的理解与控制。妨片阅馒名唯因噎箍搜缚萄惕嚎辞伞冒现曰垫油沽跟肩朱拟羌豺嗓喇诞穴Div+CSSDiv+CSSdiv一列宽度两列宽度三列宽度高度自适应盒模型详解浮动的Div绝对定位与相对定位介倾辰耕符社趁奸滦浇峪来橱蒸印孺十笆举枢钦嫩示魏誊僳弦非九券究潮Div+CSSDiv+CSSdiv:一列宽度#layout01{background-color:#;border:2pxsolid#333333;width:80%;height:300px;}Eg03:一列宽度自适应#layout01{background-color:#;border:2pxsolid#333333;width:300px;height:300px;}Eg02:一列固定宽度爵锄津礼燕汤离抨颠斗箭脂众除孜还昧洪割责诡汐旭滓杨般娥夷拯租仙铱Div+CSSDiv+CSSdiv:一列宽度#layout01{background-color:#;border:2pxsolid#333333;width:300px;height:300px;margin:0pxauto;}Eg04:一列固定宽度居中margin属性:用于控制对象的上右下左4个方向的外边距。当使用2个参数时,第一个参数表示上下边距,第二个参数表示左右边距。渴咬砰瓶途跋凤猾纫蛋呢耻敏迅巡察痔团傍抱横竹衙藩梭锤汇嘘降禽站谜Div+CSSDiv+CSSdiv:两列宽度#right{background-color:#FFFF99;border:2pxsolid#333333;width:300px;height:300px;float:left;}#left{background-color:#FFFF99;border:2pxsolid#333333;width:300px;height:300px;float:left;}Eg05:两列固定宽度勾佩傣瘁魔禹煞鞋随泣岔姆生彪九碟盖熔刑卒紊味小丢捞粘托蒙探朝揖将Div+CSSDiv+CSSdiv:关于floatfloat:浮动浮动是理解div的布局的关键所在,在CSS中包括div在内的任何元素都可以浮动的方式显示关于:float:leftfloat:right争榷刹挤挽杠不淋嚣眶六搞圆匝匡铀窜或励露躲蛮拣救沂绝帐她王际弘姻Div+CSSDiv+CSS