第七章 WEB标准与面布局基础理论_第1页
第七章 WEB标准与面布局基础理论_第2页
第七章 WEB标准与面布局基础理论_第3页
第七章 WEB标准与面布局基础理论_第4页
第七章 WEB标准与面布局基础理论_第5页
已阅读5页，还剩32页未读， 继续免费阅读

下载本文档

版权说明：本文档由用户提供并上传，收益归属内容提供方，若内容存在侵权，请进行举报或认领

文档简介

WEB标准与页面布局基础第七章本章单词Structure （体系，构造，结构）

Presentation （介绍，演示，外观，表象）

Behavior （反应，行为，举止）

XML （Extensible

Markup

Language，即可扩展标记语言）

DTD （DocumentTypeDefinition，文档类型定义）

Transitional （过渡性的）

Strict （严格的）

margin （外边的空白，外边距，外补丁）

padding （填充物，内边距，内补丁）

block （街区，块）

inline （内联，行内）

overflow （泛滥，溢出）

relative （相对的）

absolute （绝对的）

vertical （垂直的，竖直的）预习检查3预习检查当使用margin属性对元素的四个外边距进行设置，依次的顺序为()。top bottom left rightleft right top bottomtop left bottom righttop right bottom left使用position属性可设置元素的定位机制。要使元素以它的父元素为参照，进行相对定位，应为postion属性赋以下（）的值。staticabsoluterelativefixed

预习检查当页面中有多个元素在垂直于浏览器窗口的方向上发生层叠时，可使用()属性设置它们的层叠顺序，此属性的值越()则此元素就越接近浏览者。z 大index 小z-index 大z-number 大要将一个元素隐藏，并且要求此元素原来占据的页面空间被释放，应为此元素设置()属性，并赋值为()。visibility nonevisibility hiddendisplay hiddendisplay none

预习检查CSS盒状模型规定盒子由四个content,margin,padding,border部分组成。由盒子的外部到盒子内部，这四个部分的顺序依次是()。border padding margin contentmargin border padding contentcontent padding border marginborder margin content padding

网站重构与WEB标准

网站重构把“未采用CSS，大量使用HTML进行定位、布局，或者虽然已经采用CSS，但是未遵循HTML结构化标准的站点”变成“让标记回归标记的原本意义。通过在HTML文档中使用结构化的标记以及用CSS控制页面表现，使页面的实际内容与它们呈现的格式相分离的站点。”的过程就是网站重构。网站重构>>>WEB标准

WEB标准网页主要由三个部分构成：结构（Structure）、表现（Presentation）和行为（Behavior）。它们都有各自的标准。结构结构是指一个网页有哪些内容以及这些内容如何被清晰地组织在一起。网页结构的标准主要是XML语言和XHTML语言。表现表现是指一个网页的内容以何种样式来展现。网页表现的标准是CSS语言。行为行为是指一个网页及其所它包含的网页元素以及它所属的浏览器窗口如何与用户交互。网页行为由JavaScript脚本语言来实现。XHTML

XHTML是HTML的替代者，它是从HTML继承而来，但使用了XML的规则进行严格规范。XHTML与传统的HTML的不同之处，主要来自于XML语法规范的格式要求，即要求“格式良好”。必须有且仅能有一个根元素<html></html>标签必须正确地嵌套标签必须关闭标签名和属性名必须使用小写属性必须赋值属性值必须包含在引号内特殊字符必须用实体编码来表示图片必须有替代文字注释的内容中不能包含”--”DT厌DXH赛TM骄L文档偷的有幻玉效性网页份文档记中可食以使谜用的村标签凑有哪妻些，毒标签欧有哪桨些可针用的枯属性煤，属遣性可住用哪馒些值我，标为签之午间如喘何嵌侧套，幅特殊节字符踪蝶如何北表示蚕等等红。XH傅TM酒L文档嫌的有胆效性慎通过DT窜D（Do漆cu故me柔nt期T告yp辩e走De惠fi量ni边ti崭on，文差档类挂型定母义）晒来定碑义和始验证胞。在文涂档第欠一行得（<h勒tm叔l>标签队开始洗之前饲）添骄加DO拦CT砌YP昼E即文概档类妇型声蛛明。万维僻网联峡盟（W3扮C）为XH凉TM慰L制定矿了三解种DT担D过渡牙的(T捧ra盛ns加it美io衡na枣l)<!暴DO踪蝶CT吐YP头E线ht描ml盯P线UB辟LI饺C顺"-等//振W3钱C/滑/D则TD辉X锻HT霉ML夫1摸.0次T执ra尚ns告it织io馋na突l/摩/E浆N"预“ur君l">严格秘的(S链tr傲ic避t)<!澡DO骑CT酸YP府E纱ht托ml畏P锅UB牢LI阳C厅"-宣//粒W3宜C/竭/D守TD大X蛙HT猴ML缸1著.0孟S扬tr屋ic奇t/江/E俯N"筐“ur窄l">框架敬集的(F脂ra矿me诱se秘t)<!鱼DO缎CT余YP弟E颜ht然ml抚P向UB投LI除C您"-虽//将W3棚C/赌/D仆TD出X渴HT多ML约1配.0怎F府ra轻me卸se吗t/搜/E仇N"匪"ur悲l">结构毅与表厌现分穴离CS柏S的出新现，劣使得科网页短的结城构与磁表现烦比较穿清晰侮地分著离成查为可唯能。对于亡网页丽包含箱的数锐据内容，由HT剩ML标签贡负责搬承载黑，同掏时，债文档妹内众正多标乔签的猛先后猪顺序善和嵌炊套关翻系，布也说齐明了迅这些步数据以内容戏的结遭构杯。对于匆网页砖中的命每一痰个元府素最等终在浇浏览此器中狠以何党种样摘式来呈现，则泼由CS炭S的样距式规樱则来掌负责锹定义淘。CS剂S样式世规则郊一般其编写湖在网具页的济头部<h嗓ea偏d>反</神he重ad涝>中，夜这样明可使董得用捐来承穷载数固据和得描述队结构豪的HT背ML代码宴与控言制样煌式的CS钥S代码刷分离厅开来液。如朗果需步要二法者更牌进一街步地乘分离纺，则盛可将CS约S样式爱规则到转移矛到独嚼立的午外部复样式丝式表文筛件中喇。网页称的结锄构与犁表现阔分离害，带牛来的爆好处凶。WE城B标准缓与CS滋S实现概网页匠布局网页造布局谊又可梅理解铲为网页腐排版。简浪单地宋说就折是：当网页穴中的暂某一牢块内衔容应盈该放递置在删网页施的哪膛个位鞠置，搬占用酬多大碑的面司积。大量锦使用搞表格掉实现目页面老布局隐，不似符合WE讲B标准责。目前好普遍庆采用CS牛S结合di客v标签样来实闭现网倘页的块布局孕。将整趁个网蜓页的狡所有蚀内容分割成为仗相对青独立拢的内容谊块，这占些内祥容块农分别社用一互个di影v标签来包裹，再敞使用CS俘S的属港性分误别设烫置这率些内容护块的坑位置过和尺其寸。这饿样整默个页启面的匀版式牺就受晚到了惊控制欲，从戒而实培现了生网页差的布酱局。CS盖S的盒之状模活型CS南S的盒蝇状模番型（Bo征x逝Mo淘de坏l），污是使祝用CS自S实现闪网页尖布局回的还基础殃。页面荡中可彩放置绘内容作的窗筑口元蔬素称代为盒填子即Bo占x，盒宰子就笼是一珍个矩桨形区买域。每个捏盒子黄都有律内容Co握nt飞en棕t，内作边距Pa女dd室in添g，边阻框Bo皇rd宝er，外织边距Ma呼rg仔in。盒状轻模型辫用于绕描述涂它们撞之间饶的层款次，之关系麦与相上互的哄影响得。ma祖rg煮in：外蹈边距bo规rd赤er：边更框pa芳dd振in收g：内虫边距印，又士称内护补丁茂或间秧隙co扩nt纺en旦t：内软容两种备盒子盒子袄还有块级能盒子(b革lo西ck劳b证ox搬)和内联男盒子(i抗nl阴in陆e专bo克x)之分深。这楚两种络盒子施分别谁是块级霞元素与内联捧元素的默管认盒工状模描型。块级役元素di创v、ta效bl职e、fo武rm、fi姥el俩ds绝et、h1旁~h关6、p、ol、ul、li、hr等。内联骂元素sp享an、a、la介be雨l、in严pu忍t、se般le斩ct、te探xt阴ar陕ea、im凭g、em洗be匆d、br等。块级帝元素翠显示福为独猎立的捎一块笑（矩碑形区涛域）辜，它原的前慕后都爱会换非行；内联痒元素辛不会翠导致槽换行挽，它忠会和蕉其他挑内联懂元素敢一起垃在一支行内萝显示泥。内联过元素涉只能截包含缩慧文本乞和其蕉他内奔联元避素；遗而块雷级元输素则山能包绞含内间联元致素和阵其他习块级气元素唱。标准贼文档湖流盒状碌模型也的转凭换CS电S属性di特sp暮la佳y可以材设置吃网页得元素好使用笋的盒昨状模朴型。为块果级元昌素的di弓sp芒la头y属性此赋值宅为in嗽li棋ne，那刻么这厕个块兵级元范素转携变为这内联恒元素梢；为内部联元杏素的di珠sp疗la则y属性这赋值诞为bl饮oc串k，则混这个厨内联井元素谅转变啄为块谋级元寨素芽。<d阁iv拣i盲d=顾"f匆ir扣st补Di耐v"捏><p冷c撑la查ss谷="独my束p"愈>第一够个段蚀落</株p>焦<堂p谣cl假as有s=已"m亭yp对">第二魔个段等落</兆p></晨di敏v><u学l睁id切="且my涨ul喷"><l盛i>列表妇项目</死li密>释<l蝇i>列表沈项目</甜li承>奖<l挺i>列表按项目</角li购></纵ul牲><d苦iv菊i娘d=房诚"s爪ec夫on料dD述iv造">叔se贱co猴nd屋Di添v<甲/d缝iv付><d尖iv严i性d=道"t么hi滋rd惧Di慰v"腔>t趴hi迁rd彼Di福v<章/d揉iv辨>演示呆例7-垦1盒状图模型味的转行换<s演ty竹le回>#f久ir纲st蛮Di为v,开#屿se优co冤nd胃Di味v,方#叹th勺ir精dD挣iv谎{bo罚rd陶er制:1累px肌s挥ol接id套g魄ra杏y;}#m稻yu时l棵li梦{di蒜sp阴la窄y:寨in陆li仁ne葬;}.m航yp昼{di率sp巧la颂y:栋in酬li体ne筹;}#s毁ec辛on椅dD装iv政,将#t层hi能rd龙Di炊v{di悉sp非la景y:揭in笛li误ne慕;}</孤st拐yl轮e>演示烘例7-逢1外边强距CS熔S外边明距属控性用派来设中置一屯个元抢素所亏占空刻间的狡边缘梨到相熟邻元早素之幻玉间的洋距离曾。使话用ma捏rg盘in属性宿来设漏置外写边距顿。属性意义取值margin-topmargin-rightmargin-bottommargin-left设置元素的顶外边距。设置元素的右外边距。设置元素的底外边距。设置元素的左外边距。可使用像素单位的数字或百分比，也可使用auto。margin简写属性。在一个声明中设置外边距属性。依次设置顶外边距、右外边距、底外边距、左外边距。ma挺rg恭in<b食od凝y><d醉iv葬i捡d=顷"o株ut愈er危Di跨v"铅><p贸>外部DI代V块</互p><p早>这是购一个展段落沈。这郊是一朵个段络落。蛇这是图一个屈段落窜。这裙是一胜个段润落。愧这是痕一个壤段落辨。这是氧一个我段落睡。这厚是一奥个段注落。</宁p><d剥iv痒i曲d=陪"i谅nn胖er脊Di虹v"叙><p忧>内部DI菌V块</素p><p趴>这是灯一个病段落校。这轿是一揪个段酸落。玩这是胜一个乱段落桥。这寻是一店个段哈落。成这是小一个段早落。符这是霸一个恰段落雀。</竭p></益di脚v></螺di衬v></万bo妨dy识><s展ty新le币t哑yp萄e=过"t勇ex剧t/北cs燃s"赴>*{滋ma倍rg荷in矿:0挖;p求ad待di荐ng贴:0甚;}bo此dy骡{b匪ac指kg崖ro唤un还d-尚co戒lo侮r:古#f虏ed迎cb教a;寨}#o董ut奴er份Di赤v{bo替rd哑er幻玉:1浆px德s昨ol岔id滑b叫lu即e;wi米dt侵h:更40若0p插x;ma估rg兰in把:0疫px顶;ba痒ck哭gr围ou萍nd慰-c盲ol脉or顽:#重ab鞋cd乖ef抖;}#i戴nn微er低Di夜v{bo窃rd草er宴:1享px婚s奋ol辱id导r纺ed昂;wi豪dt费h:俯30散0p覆x;ma语rg钩in洽:2熟0p干x;ba胞ck巨gr恢ou帅nd掩-c手ol驳or影:#紧cc迁cc鹊cc缠;}p{饱bo捏rd漠er肢:1田px庆d俭as睁he数d委gr慨ee密n;吉}</算st鼠yl翼e>演示患例7-灯2内边拳距CS淋S内边婶距属彻性是壮用来循设置柏元素晨内容架到元逐素边棕框的驼距离舱。使匙用pa耕dd瞧in焦g属性竹来设侦置内它边距距。属性意义取值padding-toppadding-rightpadding-bottompadding-left设置元素的顶内边距。设置元素的右内边距。设置元素的底内边距。设置元素的左内边距。可使用像素单位的数字或百分比，也可使用auto。padding简写属性。作用是在一个声明中设置元素的内边距属性。依次设置顶内边距、右内边距、底内边距、左内边距。pa塑dd扇in泪g<b膜od求y><d冤iv御i蓄d=伐"o粘ut花er宋Di饱v"锡><p峡>外部DI川V块</步p><p偿>这是证一个书段落些。这抗是一闭个段骑落。购这是岸一个折段落概。这优是一刑个段硬落。顺这是母一个仁段落绒。<d驳iv恩i围d=誉"i菌nn衔er奴Di埋v"迅><p北>内部DI涉V块</例p><p有>这是猜一个牌段落湾。这笔是一厌个段真落。殿这是陆一个胸段落具。这经是一岗个段透落。乎这是夹一个段微落。创这是约一个肾段落双。这馒是一佛个段粱落。翠这是蹲一个角段落怀。</愧p></些di复v></朝di纲v></非bo堪dy多><s异ty泼le戒t次yp仅e=跃"t您ex弊t/爱cs接s"鹅>*敏{m楼ar盈gi鼻n:闯0;梳pa焰dd垂in规g:脆0;裙}bo艇dy帽{b瓜ac丛kg食ro纽奉un欣d-晨co棉lo犁r:权#f捎ed僚cb视a;彻}#o肆ut根er学Di察v{bo铲rd惯er纹:1厕px熟s焰ol皇id兰b叠lu眯e;wi蕉dt宝h:舒40闹0p捆x;pa析dd化in乡丰g:资10恼px触;ba悟ck苗gr翅ou篇nd悲-c斗ol蓝or伟:#猴ab糊cd身ef硬;}#i框nn仍er牲Di创v{bo宵rd雷er负:1莲px停s玩ol现id字r弹ed智;wi川dt购h:判30箩0p感x;pa泰dd福in普g:直10依px懂;ba页ck肃gr干ou汪nd租-c刮ol华or圆:#迷cc侮cc需cc皇;}p{贡bo椒rd风er吹:1胳px益d多as锈he如d筋gr找ee压n;绳}</尼st稿yl凶e>演示丑例7-佣3尺寸CS甘S尺寸烦属性吨指的兼是co以nt万en同t内容旷区域卖的宽变和高瓦。使庄用wi择dt倒h和he洋ig匹ht属性众来设它置内电容区溪域的绑宽度桥和高谦度。属性意义取值width设置元素内容区域的宽度。可使用px像素单位或%百分比。height设置元素内容区域的高度。可使用px像素单位或%百分比。wi天dt掏h和he肠ig壶ht<s衰ty离le绳t得yp骡e=在"t曾ex以t/扮cs吧s"愚>#m督yt关ab绩le稳{he盆ig胖ht景:1拨20永px坡;bo贿rd腊er喂:4秀px约d岂ou玩bl刚e纯bl甲ac刊k;bo暖rd奏er电-c源ol推la壤ps厉e:塞co庆ll逼ap捕se贺;}#m瓜yt泳ab丛le驱t恰d{wi扰dt拨h:理18工0p与x;bo投rd陕er鼠:1终px浴s慕ol丝式id购g纯ra耕y;}#m支yp四{wi混dt问h:搅45肥0p弓x;迁he扮ig革ht根:8填0p瞎x;ba赴ck邻gr枝ou斩nd唱-c垦ol胖or及:#疑fe剥dc栋ba冷;}</梢st鸡yl西e><p纳i坛d=浊"m闸yp剧">段落期文字桥段落掌文字红段落岂文字椅段落新文字锈段落络文字忆段落鼓文字执段落在文字健段落姿文字段变落文怕字段卷落文劈燕字段妻落文傲字</颠p><t寒ab束le精i择d=盈"m显yt叹ab馒le猪"><t比r><t烧d>单元蛛格</瓣td伍>显<t寺d>单元粮格</所td明></态tr侨><t哗r><t锹d><i阀mg守s厉rc涉="维im筛ag除e/贺eg夫_b戴g.京gi短f"近a用lt谁="示例姥图片"st昨yl续e=瞧"w恐id逼th访:1驱25杂px责;h针ei各gh晴t:絮12慕5p滑x;页"/棍></姻td求><t痒d><p剂>段落索文字诵段落指文字冒段落揪文字秋段落轮文字朽段落济文字颈段落赚文字唱段落房诚文字华段落劣文字段无落文势字段箭落文宣字段明落文较字</喉p></邮td浸></擦tr羞></割ta架bl到e>演示遵例7-御4溢出CS策S溢出搅属性弯指内火容区神域的恢尺寸造不足药以容痒纳元科素的截内容牵时，拳超出技的部古分如租何处粘理。柄使用ov碰er羽fl占ow属性厦来设读置如锄何处判理溢爪出的德内容伤。属性意义取值overflow设置当元素内容所需占用的区域超出内容区域时，如何处理。默认visible，其他值可用auto、scroll、

hidden。ov痛er肿fl园ow<d仇iv凡i锦d=撒"m遇yd在iv给"><p崖>这是以一个狼段落</保p>邻<p去>这是些一个借段落</解p><p播>这是要一个脸段落</墓p>衡<p抵>这是碌一个脊段落</异p><p尤>这是肚一个奏段落</恭p>立<p求>这是单一个血段落</畅p><p肯>这是疯一个长段落</图p>系<p抗>这是屋一个惑段落</秀p>……</目di挡v><s谅ty缎le华t殃yp秃e=建"t作ex划t/周cs虫s"耽>#m驰yd掏iv的{wi提dt观h:耳30屠0p饥x;he侧ig度ht蓝:2僵00床px堡;ov评er沸fl被ow:s缠cr来ol粥l;bo膛rd纺er薄:1笨px录s旺ol庄id槐b缴lu泡e;}</仗st纠yl麻e>演示腔例7-锡51、2、3、小结1盒状者模型厘中所叠谓的竞盒子即如何纤构成法？有哪匙两种怕盒子接？分漆别包凝含哪昆些标裹签？CS城S中哪跪个属艺性可奇以改绑变HT锯ML标签陷默认预的盒宾状模腥型？与定皱位相献关的CS敢S属性定位煤方式坐标层叠甜顺序对齐错方式定位伯方式远和坐跪标po霸si膨ti炒on属性惊可以辽设置茄默认集定位为方式沫之外殃的其产他三识种方冈式。to砌p、ri盼gh勿t、bo桐tt眯om、le犹ft用于扣设置哨定位杀坐标畏。属性意义取值position设置元素的定位机制。static，静态定位，默认值。定位于页面文档流给定的位置。relative，相对定位。在页面文档流给定位置基础上进行偏移。absolute，绝对定位。以父级元素作为参照，使用坐标进行绝对定位。fixed，固定定位。固定在相对于浏览器窗口的指定位置，不随页面滚动而移动。toprightbottomleft设置元素的某边界相对于其包含块相应边界的偏移量。默认为auto，可使用px像素或%百分比设定。绝对津定位<b伯od湾y><d冤iv碑i攀d=令"f处ir昏st敢"><p怎>f活ir膏st忧d默iv位于bo叫dy中</血p></牧di耻v><d稍iv型i籍d=置"s拔ec宣on驰d"造><p送>s役ec耕on喂d纵di蹈v位于bo福dy中</销p><d压iv允i侮d=桥"t皇hi交rd坊"><p指>t安hi散rd照d酷iv位于se为co驻nd驰d厚iv中</概p></话di倘v></旬di参v><d姑iv粪i英d=眯"f栏or诸th简"><p凯>f裁or兼th丈d垄iv位于bo债dy中</剩p></方di仅v></架bo难dy守><s尚ty导le岁t磨yp测e=层"t倾ex石t/富cs匪s"怀>*互{m垃ar伶gi梳n:候0p牵x;滔pa鼓dd唇in歉g:唉0p转x;顾}di梯v{荐bo誓rd活er摸:1车px诞s示ol剩id叠b医lu眠e;愁}p{希bo星rd肥er牧:1面px锈d捉as隆he真d洽re炒d;要}#f下ir验st{po学si和ti蛙on决:a索bs钥ol哄ut皱e;le选ft毙:2副0p平x;导t贪op阀:1遇0p托x;wi元dt赔h:肺22知0p通x;绵he杠ig匆ht腥:2搂50骄px尼;辫ba挠ck某gr栗ou烟nd乳-c程ol目or延:#我ab铜cd兄ef芦;}#s滴ec枯on摄d{po辣si馅ti滥on春:a猛bs异ol右ut耗e;摧l丝式ef卧t:筐25凑0p都x;哈t属op气:1北0p饲x;wi后dt狂h:忆18叼0p伍x;剥he恐ig烧ht故:1君50处px秋;民ba辨ck否gr贯ou蔬nd诱-c押ol漂or溜:#市ab饭cd究ef俱;}#t貌hi陵rd{po把si逼ti醋on藏:a盏bs玩ol怕ut忘e;中l立ef记t:遗-2粪0p走x;馋to扇p:再50肌px协;ba倦ck碑gr肃ou杀nd垂-c嘱ol野or广:#绘fe御dc辈ba露;}#f要or看th{po歇si毕ti苦on尊:a郊bs园ol良ut道e;le拦ft办:1漏00碌px蜂;娃to昼p:睛12翼0p岂x;wi泽dt故h:翅18身0p扎x;石he州ig贤ht僵:1防00池px允;沟ba乒ck增gr卸ou翅nd礼-c遮ol炸or辱:r昼ed愤;}</广st影yl揪e>演示辽例7-慨6相对善定位<b妨od幕y><p抓i各d=摊"p肌_p包os漆_l歇ef轿t"窜>这是车一个酷段落</黎p><p倦>这是听一个挥段落</辆p><p霞i开d=练"p仗_p附os咬_t棕op信">这是洲一个趁段落</颜p></孩bo吊dy定><s针ty迹le夺t惜yp上e=赖"t贺ex遍t/碰cs李s"沃>p{级ma从rg矿in默:0信;b肃or屡de返r:现1p爆x陈so说li会d险gr壶ay侧;w恳id轻th继:2唇50婶px兆;}#p顶_p姥os午_l恶ef冶t占{po册si腔ti碌on砌:r劈燕el友at冤iv摔e;嘴le乐ft涨:2枯0p净x;}#p物_p被os鸡_t糕op惰{po饥si忆ti越on烘:r怕el仇at公iv忙e;龄to置p:怠20罗px倡;}</顶st骂yl珍e>演示泥例7-井7固定易定位<b庆od套y><d伏iv哗i察d=腹"f辩oo柱te振r"学><p夕>不管浪页面葡如何处滚动运，我长自始备至终零都在每这里宜。</认p></猫di炭v><p杏>页面愤正文</源p>搁<p议>页面替正文</袭p>永<p腹>页面篇正文</尼p>兼<p奖>页面杏正文</迫p><p予>页面柔正文</观p>兰<p醒>页面彩正文</捏p>予<p牲>页面旅正文</距p>猎<p秃>页面薯正文</从p><p组>页面胜正文</湿p>画<p迎>页面递正文</冈p>促<p睬>页面拿正文</肺p>水<p维>页面演正文</万p></误bo陷dy亏><s铅ty劝le洁t葬yp所e=辰"t具ex型t/碧cs酷s"殖>#f兔oo今te顿r{po欠si傍ti扩on锐:f美ix月ed考;胳b艇ot授to储m:训10勿px沫;尿r郑ig喇ht结:1顽0p脖x;wi橡dt淘h:悄35俗0p现x;霸h恐ei伶gh眯t:该50服px挥;ba立ck躬gr崖ou光nd越-c需ol右or创:#筑fe吐dc福ba携;}</愉st碗yl厉e>演示赛例7-厨8层叠巾顺序网页拍中的番多个青内容则块可合能使证用多醉种不赔同的舰定位个方式卵，这进可能电导致熔它们死在垂叮直于美浏览惨器窗觉口（碗或文曾档正煎文区旬域）杏的方善向上牺层叠围起来船，相越互遮苍挡。罗使用z-盖in耳de日x（Z轴索鸽引）属性陡可以岗设置衰它们脉的层涛叠顺关序。属性意义取值z-index设置元素在垂直浏览器窗口方向上的层叠顺序。使用数字设定，数字越大越靠近浏览者。为负数时，作为页面正文的背景显示。z-芬in已de痒x<b登od陵y><d党iv检i呜d=冬"f辆ir督st拉"><p恶>f流ir悼st陪d纠iv位于bo曾dy中</槽p></烤di掏v><d育iv筹i魄d=晒"s漫ec北on授d"页><p边>s论ec母on菜d糊di矿v位于bo精dy中</挡p><d芬iv商i队d=珍"t泰hi助rd盐"><p喇>t盯hi岗rd武d冈iv位于se椒co衰nd国d石iv中</艇p></帝di衬v></轿di禽v><d狠iv罪i千d=章"f煌or爱th做"><p素>f纳or河th受d递iv位于bo矩dy中</秋p></枕di远v></冒bo序dy覆><s钢ty玩le鞋t缎yp永e=黎"t殊ex振t/建cs糟s"君>*岛{m饰ar雹gi侮n:赠0p绍x;怀pa森dd记in嗓g:崖0p埋x;哄}di昌v去{b鸦or次de秤r:扒1p振x躲so迈li斑d痰bl互ue想;}p决{b轨or拖de府r:兼1p简x面da遍sh棵ed亚r惹ed拢;}#f鄙ir博st{po愧si睛ti葡on惜:a经bs岁ol纯ut手e;陵z-飘in益de彼x:扰1;观le扬ft构:2伙0p骄x;笨to演p:液10推px愈;wi御dt绩h:罪22呢0p出x;夸he诸ig搬ht蹈:2灾50遇px毫;b麦ac篇kg卸ro蹦un铁d-兽co傍lo丈r:布#a岭bc亭de歌f;晶}#s留ec正on撇d{po贩si绸ti漠on雾:a辞bs混ol遮ut阻e;z-积in塌de节x:美3;好le碌ft舟:2币50搞px原;t哈op店:1膀0p愧x;wi稳dt誉h:啄18丹0p敌x;谨he肝ig励ht臂:1位50弱px违;b翁ac捷kg己ro侦un乌d-诊co协lo灰r:俩#a遮bc无de她f;台}#t云hi柳rd纵{po载si森ti意on许:a依bs啊ol仇ut彼e;巧ba跪ck闹gr染ou任nd探-c各ol么or六:#哗fe怎dc阅ba哄;le粱ft列:-戴20脱px武;t颠op舌:5灭0p性x;植}#f佣or牌th{po坊si似ti车on警:a恐bs坡ol惧ut调e;z-恋in阶de悼x:霜2;蚕le推ft嫌:1谷00呈px扶;t蹄op刑:1笔20柔px目;wi忆dt止h:汽18候0p倦x;克he愁ig鸽ht窗:1沉00转px马;效ba展ck监gr湿ou素nd柜-c作ol书or屯:r蜻ed映;}</斥st休yl茂e>演示怖例7-闻9对齐总方式对齐骨方式份属性跃用于般设置复元素严的内亭容在耽作为葬容器辅的元跟素内卧部的浆对齐逃方式根，有惯水平挤方向摔的对唉齐方麦式和贤垂直拉方向塑的对痰齐方罚式。属性意义取值text-align元素中文本的水平对齐。可使用

人人文库> 全部分类> 教育资料 > 课件下载

温馨提示

  • 1. 本站所有资源如无特殊说明，都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等，如果需要附件，请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸，网页内容里面会有图纸预览，若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间，仅对用户上传内容的表现方式做保护处理，对用户上传分享的文档内容本身不做任何修改或编辑，并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容，请与我们联系，我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

最新文档

评论

0/150

提交评论