前端记录第八天_当为relative,top为正数时是向上还是向下-CSDN博客

本文链接：https://blog.csdn.net/weixin_71337282/article/details/135566344

定位

更加高级的布局手段

定义：定位就是将指定的元素摆放到页面的任意位置。通过定位可以任意的摆放元素

通过position属性来设置元素的定位：

可选值：1、static 默认值，元素没有开启定位

2、relative 开启元素的相对定位

3、absolute 开启元素的绝对定位

4、fixed 开启元素的固定定位（也是绝对定位的一种）

5、sticky 开启元素的粘滞定位

1、相对定位

相对定位：position：relative 相对定位，相对于自己变化

开启相对定位，不设置偏移量元素不会有任何变化

相对于自己之前的位置移动，不会影响其他元素

特点：

1、偏移后原本的位置不会被其他元素占据

2、设置偏移量的值可以超过父元素，也可以覆盖兄弟元素

3、偏移量可以是正值也可以是负值

4、开启相对定位的元素不会脱离标准文档流（下面的元素不会跑上去）

5、开启相对定位的元素会比普通元素层级高，所以会覆盖在普通元素上

6、如果同时设置top和bottom时，top偏移量会生效

7、元素设置偏移量时，可以同时设置margin值，但是不推荐使用

8、元素开启相对定位后，块元素还是块元素，元素不会发生转换

9、给开启定位的元素设置margin值时，是相对于原本的位置进行外边距移动

偏移量是跟相对定位组合使用：如果不设置定位时给元素设置偏移量无效

top：向上偏移值为正向下，值为负向上

bottom：向下偏移量值为正向上，值为负向下

left：向左偏移值为正向右，值为负向左

right：向右偏移值为正向左，值为负向右

<style>
        .father{
            width: 500px;
            height: 500px;
            background-color: rgb(125,125,125);
        }
        .box1,.box2{
            width: 200px;
            height: 200px;
        }
        .box1{
            /* 开启相对定位 */
            position: relative;

            /* 设置偏移量 */
            /* top: -20px; */
            /* top: 20px; */
            /* left: 20px; */
            /* bottom: 20px; */

            background-color: aqua;
        }
        .box2{
            background-color: blue;
        }
        span{
            width: 100px;
            height: 100px;
            background-color: red;
            position: relative;
            top: 20px;
        }
    </style>
    
     <div class="father">
        <div class="box1"></div>
        <!-- <span>你好</span> -->
        <div class="box2"></div>
    </div>

2、绝对定位

语法：position：absolute

特点：

1、一旦开启绝对定位，该元素就会脱离文档流（下面的元素会占据该元素的位置）

2、开启绝对定位不设置偏移量时，该元素不会进行偏移

3、开启定位的元素比普通元素层级高，同时开启绝对定位的元素，下面的元素层级比上面元素层级高

4、设置偏移量后是相对于父元素（有相对定位的上一级元素）进行偏移，如果上一级没有定位就找上上级，如果都没有定位，就相对于浏览器进行偏移（子绝父相）

5、开启元素定位后，元素会变成行内块元素

6、绝对定位有偏移量后，使用margin-top和margin-left时，元素会在现在的位置的基础上移动（开启定位后不建议使用margin属性）

7、不建议定位和浮动同时使用（开启定位后浮动不生效）

8、绝对定位的元素会影响到兄弟元素（绝对定位的元素脱离了文档流）

<style>
        .father{
            width: 600px;
            height: 600px;
            margin: 100px auto;
            position: relative;
            border: 1px solid #ccc;
        }
        .box1,.box2,.box3{
            width: 200px;
            height: 200px;
            background-color: pink;
        }
        .box1{
            width: 230px;
            /* position: absolute; */
        }
        .box2{
            width: 210px;
            position: absolute;
            top: 20px;
            /* margin-bottom: 20px; */
            background-color: blue;
        }
        .box3{
            width: 220px;
            background-color: red;
        }
        span{
            width: 100px;
            height: 100px;
            position: absolute;
        }
    </style>
    
 <body>
      <div class="father">
        <div class="box1"></div>
        <div class="box2"></div>
        <span>你好</span>
        <div class="box3"></div>
    </div>
</body>

3、固定定位

语法：position：fixed

特点：

1、开启固定定位时，元素脱离文档流，即使不设置偏移量，元素也会固定住

2、会影响兄弟元素

3、偏移量的参考物是浏览器的可视窗口

4、会将元素转化为行内块元素

top和bottom不能同时设置，同时设置bottom不生效

left和right不能同时设置，同时设置right不生效

<style>
        div{
            width: 80px;
            height: 30px;
            line-height: 30px;
            text-align: center;
            position: fixed;
            right: 10px;
            bottom: 50px;
            background-color: #4f4f4f;
        }
    </style>
   
   <body>
    <div>回到顶部</div>
    <p>同学耐，平杨分久到不说韩训的尤才沫，全能陀以我皮导训才在，绪的极人之将秦的制往登她尤六收着，名报秦先可啊说才龄，过无日舟，韦下姑陈的气程始，土往畴丹，书瞠榜为的的秦才死哉，过安说他投说，到春将死诗非办发贼易子快秦仍瞠作单，非全日开第得目关鲜，有的负生等仍作却尽不，秦劝自他苟这入我，一卅要畴临胜王活整下的了一宋我，知太到起德真里策憾生航位策他恩对守人，答人原非下你，反觉张死娇榜她，好量策此终，千畴无份人他二，都畴郭我牛下脱词收意不慷一绝始要，命几狱罚罪，对尺千气说召县卡归常惊者衣何，十是应把创兮国四望正日可在判唯力尝三，为定嗣六斯价单衣说谓和李撒法，览非帝虽人倒至商为承月留陀收，见国前承却而你自吞死动但了于人许在，哥找游由到李恼活回为意言活禀拆了，太一国下对秦车定大解决国拿，了用答山就，不是战句身求，侯在安承才斯切必联，有看非收那衣变别说尝不者虽，到之同互房于若制尺为燕重大回，价统山谓面是能勉回终，弟韩书招落失就学留惊玉人丹，杨程事罚快才斗使朗说的生担是，赠师骂，即的死们鼓，韩作法与已人召使土，君尹同死之弄年花活收真是才清幕曾人，云后到也梵所句名气风生玉制，人略用想过败从老王你两落但斯情，我落而但乐三惊之哉，人没的了虑一尝不明衣得说而老，生何会原别而是觉因者非的使，非畴设种选着不说订位保，智俭极三而秦郭真鼓资要普，我帝李穿畴天沫马因两却孔之念，留与倒希低来念使木甲有策才况这答，定厄仆死升安什关普人尹爻下，你人貂普是仆恼主马快，联的丐郭，木秦尺说都，厄是躲几其为君尽事是甲郭打拾不花车五，成到重全至不下颜，不作己则司丈给人重担作的慧耳，保第是们修承一因恼第知承上杂，会打卞于失死仅场杨失褒专月说，付了无临死到极，人你那决地至论活，活忧我决丑仅兼德终安冇，是感马对一忧己的仍太长生事，那程事足况王锐着卧县，躲不败王，词在临磊念极郭魂身死哉主出在，出得要性往认马在自郭是兄，其终人是洪法王在对平非召拆居相所帅，自极杀反解就亓事不官打罪他关今，变杀颜教尽爻匹么赐自叹极而韩国，拆的他卡希德天勇，韦仑千，极接同是，面韩韩治自便廿人而老李卧，日那面仍找案苟令劫有场一仁过拿德洪手，乏得种无不太杀活作系到，设尘逝尘下五撒真，国玉朋心，皇尹药志，陀才临慷就，落反关的，开为下笔便久了师友分只然感罪为养耳，冇归诗在兮愚乡畴支锐言法判同，尺航天设入，我子治云会是了皇你上锐开得后上可心备是，联人极今友评没九老在措判老绪愚人狂，侯德切领，和即中说了也学听了作冇惶揽说他若，他不促未他刑，原愿虽他高非逃夭十有拢杀办为量大，打然得主非使宋来皇，天将面厅使之妄就说了我明小联徒都特，起后才台九，的鼓有故收土是洋官君笔杨传应王太韩，程全我才梵，自论没劫制归好量这一李什他的不二普更，力尝解足视曰不，切的办胜恩云洪，彷畴的程己的锐人商揽死之行县有交保下，竟劫出家骂冇范徒弟洪承救的修乏训，何无必故动，只我死不秦壬就子是未人使，啦在要纯在哉过着订他才说，担明商觉策，洪县于灰见虽到然也可人放兮啊了，得土办妙搏劫要程，交帅系而姑心，场原叩到入，后君千，以他程斗重我战得关事着助自能国过几谭谓，老赠大会开，爱认足葬并二颜起上毒的锐事上，德动拿才锐人者外且薪为二三勉将惊了人，光尹彷说沫仍饮丰音，事才在者，面法承收极慨予案留我，人的其程韩耳罪况和到死，当种无极无后君皇刑无的承和张得道区丹沫，洪为动帅人普未吴惶李，倒的在别谓，下本而花笔是守等是幕之杨一，发领耳君作音书牙尽，乌航娇第秦就以统生领，范冷者她人梵在色次作你在法，后生司说要请法应也化生，杨落谭法韩洪只，他然收同畴畴至满无二公明里未教家，只时与意弟秦秦之气这大用到化方不千斗，同之会意着九服可，负啦自讨付出，为这完回劫的，郭而吾君人云招狂人娇，手吾化丈放娘对娘司金破，因为本友，就啦愚活先心故十屯谷别宋，搏巴骨来使把韩感惶面生小的者总低，木来我身只次丈系支不三和，游的十的他杀者面许，见不有，畴张才样葬出秦承个上降活艳使王举大办前，己两法们流老是宋，德司情可是快若判十你世楚皇大畴皇设皇馆，帅导三太，谓不子尘间，向人褒爻韦天头，使程罪你，价语斯是，的让将他何骨小也，才求秦，公之者出极，憾惜主，修没仄下说月德要揽惜丑说我死赐对张，了为这，终快投报的二巴，有不叹同，一了衣时说畴病不子尚，土杀这快能不乌同败蒲解，光在一一仍官命前竟日终者，人尹为是老自持己己奔若无，其统事措于于回说掉就，为年妙着上登心都皇修找价但的畴领帝嗣，一他非血说太临，我勇仍也玉，到报程人磊人爻羊文化过迷真范持总愚如，洪的勇人台快冈回张极才我答判车他谓那况，了看你，拢承人哥貂为丹起价，哥的法的是十亲是德，并秦快今我承丑是定畴连读仅小高五，仑绛留三航下罪说羊盲乐上高郭，太接下法国耐其娘妙我，羊我在受的虽，事愚与发战我乏骨非，感十嗣，当然惜特害国上居学，得应若被她两土知，死在好郭知的冒太，登娘他非降想人秦着我的变书畴，可司偶，慧蒲平，喜往智的活了忧有九薪使法，领的没上意以和，法的才五弟化洪价文一德天怎尝当死，不韩重因千非马到，作人极，洪兴爱生的尺长秦到我帅游李前尝世，何所了所珍，人相到十负的以派是非沾到，主我勇词备斯者我娘降而生水上让，了拾的且光死一游是了藏，会帝德京留法交终幕越怒章倒，忧尚县唯受此为愚那郭非乡我自，说内战李，君是郭丈以找他没不同教览见赏出，的以国老人不我不关可世张，说在么主逃逃奔流放普郭说，一得留区，洪畴太仆锐奔苟人在一了风云，谢车者，之太燕兮是得量第他人楚笔并圣，衣入以无气乐才非郭孔，六句李作事千家答动畴土恼主即，燕看化慷并为上到文的对曾一，哉看釜资请普将为打读，创故骂、间虽么，德秦李同就有案了常时能，勉畴极然促鼓藏到在善搏，本官是掉文，是挟他如的身之君君人里如当密赐，王何卅珍韩事范的求疾或以十感罚兮讨兮语，反师司，他如策下我了得卡助非，开妙航相我大，书不找会生韩，到锐低一若木啊二憾仇，说人说，嗣不母如找卡价才秦上永是国明疾首程，刑自了上，好一我法宋是败来起过中，人说世斯救二然变次才，始郭办人设生上就个县氏付司也人天病，那答为畴沫的己梵尘你活范尤狱快憾，易死为他我么，卧预曾洪此密诗，落子韩死量妄生自也处挟担重愚，是决我，高非论正普，吞也第官欲司娇，支入大是先不，里升别司降上年为二王以知，韩葬人保活是后你说十找，土死冷才同秦马啊无冒招是责了，己婵自交若方之币娟作人送，匹未一办六官就你谋天王苦愚言不胜，五文色分皇选友报德作言骨生，志罪人人叹嗣卅家，用宋磊陀她辜说因郭，护事论嗣啊落由许情言，的间了派商的洪然其葬羊，倒出娇谭盲事越为蒲杨，德普的娘，流面力和君为谢自极中非不的使因智念一，鼓感今嗣太后终老师马命骂了命秦，如手罪越法五应命必魂甲也登人一老，斗气极法本，降百娇京份责后，看不的洪釜恨一况降要故只秦，动他脱光国我意打而耳皇罪投陀，乡则己足龄土至自然为归者日之斯为，毒然中尹韩不轻罪希为当卑心之用人里有低，二罪耐负世，联在尽同苟谢落同何，然评读之有是己回生心锐秦，皇范够司竟，是也者范回国官色么人心承说，到陀如是略搏此虽与目娇，的头音俭尝创盲见放冈听牛法资骂杨就么陈，是了因一斗娟收无会归高嗣迷你自一千绪死，读归赏临上的胆回了虑到不今，和融在为被恼好都叩此挟说，措之非命磊思畴者乏者已，才牙使洪蒲乌秦德，活穿说老艳高范灰台，为李那的在上郭句，韩事法所才蒲他为法仇竟遗一变，虑之君升人拾爱皮生惜在韩非，己卅所战持教只心幕常罪可未绝书的，位后婵求非斯不后死云们不，恩小法无才，在能不自非通搏了尘作处这送王，收人够谓说其希帝的以釜第惜感上，秦明张，无何君么判对极不衣高自狂不秦了有，喜白后，韩只要仑以土狱区为赐几苟同，出见苟大救王对，上先井呼高吞人王气者说同才何爱，间婵血那曾二，杀薪赏逃承念秦，不手文留说，召韩白之回永国皇答杀孔由巴秦啊命杨命仍，的种国流之后珍有我最子皇了弟回一巴召，苦国才杨视为以一这么自不贤够事杀可，位皇没宋只老问在两子高间够君百先沫房笔，使和的拢我你徒放时书居入冷惶，令韩找杂李订帝予得吾匹榜用，评拾人心我，于车你娇气毒花刑得贼撒小在越要馆，事罪要你原主而承足褒才，的生思情远与人几自太说尽，商人李娘畴了出呼台念落，予何时倒逃弟生仄了是样兄公的赠与亲己所，二情不恨为章派夭洪价自秦有，所责战放拆沫攻又，极畴言仓土苦是案斗是什保，郭圣人薪雷我到持种的他一尺的拾，使不求是留快设生韩脱可，心谓京不快命话韩的便许的千兴，土羊薪娟回予可人他统你人尹司，家同姑意老我，如者不种牙文娘实姑薪张说在落德，得招没普两县韩王视好韩为之够，后的、是胜学事，房变联日天拆畴韩尹者李洞介一苟头薪仅觉，判活居地要人竟穿持郭所新令，得的轻，的他助到的为氏作者次至，的天我派，倒他冇专，才友着韩国是孔喜你，汪治则，幕俭事遗锐论小土和君欲当非何普来见，读对陛为正土畴虽此作的韩秦，拿幕如鲜一系唯在君，尺珍动要贼我人上十房兴皇哥下仑，领一易什场答才把郭是，亡感李关，能家鲜则饮土自说有当报则打韩感高赐子，临司或关说程土之感看血故德时念好能破，姑木韩开志，竟者命妙王是出是锐故唯，幕亡圣极太姑不韩事大皇别一何，说别量平往孔才子主了会得，害高雷中切耐定和勇子自打人人卑郭孔，法王主仅使久情服找锐他郭落意使举，打况作壬向玉变投她狱尘章于公骨都罪，的活相今年仇的生是日二我，掸量子盲求归下说，王负偶，事若玉绪思二高苟活洪一落，洪冇年种请最褒后不，非应量得病德的啦年，目是韩范纯高妄国王我心专，特的自中才已，洪哉他动王什斯事招，秦情韩生而今在下解不死决他，子普生他书韩起但，我是恩普的重找人药秦锐郭统，收说使俭由狂幕如雷衣作，么有松欲者，航落的反知夭以量先非自死迷姑生上之，丈时说破承逃家你你一是揽气教，的人词前，骨予们承韩为一韩气何于第，历李药之马苟牙范徒德降失幕如人，斗是为人，币陀秦，韩在承解留掸后才极，夫爱意责量张是，之狂等招洪护措人徨，以为拆秦教气之下得，重夭降大是肯逝是助便普，范上活掸之几挟有为小事，小俭畴者的说不六谭出派和老语壬谓欲己，见时不逃气设都你了丹己不饮韩者，终他回以丰白感骨国哉讨们子，的其老叩穿的洪今害君艳妙，杨衣主关死人留狂动掉非气知前衣人得者，楚惜耳认气锐子国领，妙罪办小血见中找老后，里壬我，认文案亡何且诗月松，马倒为不欲绪间商的是范文整则慷，帮卑在也间到卑承他老临轻化以惶令帅前，者鲜非导赐拢化在非平哥，主者丑她帝其郭不的就太慨惶欲俭后慨日同，活者放壬有活，我他洋姑足成，词国韩都无思是，降已服，杂不见，司论历宋未恶白皇使却洪慷自，先同有自害，若游韩夹胸许别一子，为吞褒其生亲的绛路守毒惶而第王可可仑弄，褒动我了极王洪，使尝一，下在逃在的先不但身服畴极切陛，赐杨的登郭迷身珍收哉人活价月负鼓，愚的光京应人才着竟送一，太留勇，见己行，就苟今败得得承自是揽姑游成，嗣反会磊可之人，故的传馆的皇无教之匹让活作畴所二，文价为制大骨，孔韩中的颜，留没临得得导国壬第他二太绝归行，的宋于韩即己方之韩，嗣谓土然郭善自不宋但药尝时念求了才，婵后六谓则把罪妄之切爱之罪吞洪，皇秦罪居降程明山投了兼沉才可，王才作韩死，的报木陀人位归哉马有丈，故着雷房判夹后雷，慧斯韩则，叹沫洪知爻从我亓人中流春介张姑易陈，由单日是，张甲得人之尝学嗣为者，乌他掉自属友没如家才在音文己乌尘订，说则的时已太对人居冒徨到受你是然尺，付出不教都动惜切着俭帮感入，愚春陛洪，么也救这向司轻么让，李向仑死承手贼极胜得而书到乐畴是，之解锐的，更出生导为有偶高应且两略他互生穿然馆，圣也领十王无定太鼓吴，仁文高别什变鲜国娟们主鲜定愿，的范事虽次首只你死得如，是落事资天生在下绛法以搏中终有生是向，五的人日不化场韩送舟愚吞反在台三上，感使终韩后下一如何德而讨，壬得普于变发不范吾釜牙讨以畴领份为下，中那者才是向德，足狂全，才交自不自就而，说我仇身回，明司惜的药学，临会娘长承金逝生自陈举孔韩等护，司家章者攻持斯罪弟判不德千之已尤，同生方则吴谋动教九高的上使陈法觉秦不，日老一判相落，十几付问升也有，张服生不风后中洋语皇娟，得在当卡交外好小盲法判自定程到你气我皇，到付作土，上斯下护耐败洪得，欲那间未到笔话血，韩一说了他人性自天如张老忧榜处就，搏的可念爱撒密圣临到时他到受死实，在关的李而一于不商九孔皇韩留所，没拢要自秦可是语的全国力衣说和冇，日后程郭第心人衣心入马治始得中见，承如间不法为百，希后杂了娇逃明日，仓谓遗让事慨到藏为母，程到案兄好皇见在秦是却书反死当也王，因密冈恨由李愿单如韩，饮丐皇尝实下，国五锐而人仅国秦他通倒，人了大普，落死洪没火马为融心派斗程梵如受自可说，秦化他程恼不偶密光们搏法，他往吞之互与尽辜己一竟所不时太法不始卑，生太若何官掉，身才们区了珍赐，不下在不为落李颜为秦，百投承有郭才地掉这力先仁关因完你是着人，二担老病又屯金之头性留低承的治胆笔罪，化娘担的使国，落之尚作变至非而躲喜否是，丑斯己他承百的哥路，本特哥金，老承在逃低玉匹到，水严准，九力杨风智弟是四雷常币张辜会孔着，领衣偶创谢手俭皇反叹场真中君，的于主盲是学人特夹才的，之甲啦救他设谭，预而么小生妙，可被教仍玉贤起不中药书，又是者法六竟韦妄了听问害才友关，光秦要其屯没，斗不感逝导起者种你于，量洪都，天满在已如了区谷不，于杀杂俭开老以仁不商接，的小他土韩其目、在少略都案能上不人，同世洋一韩不而，始一重君夹第书辜山燕是云找或貂锐没者，我子快派到非秦一极洪好中手化一辜洪褒，谷竟学才区最，单了心没订普洪皇撒，太前想放，偶性婵、人命高气，种也马德用婵考洪救程与馆陀意大仄快着畴，一过挟不活韩见始策畴有太极作竟妄，洪的太清，水谷归我生水投秦爻读榜司尽的，德云评杨胜气得，冈回杀公别和，太者章安者后意路秦低以发因秦，人又锐太三时法赐与然小他应婵冷竟量郭，罪有九法德而，语时牛报丹，丈也娘五吾畴十的年尘有名洪嗣，胆沉上又后宋韩的其欲，一变法未天着密穿到仍皇人极罪承战虑也，我出徒月绛程在定如说攻，价的谷自到得是不胸他你服国但事文了厅惊，的专以之为巴愿是韩，衣没在月，由会廿极派，韩订人不是虑夭有而中中将，招这思己全必单思的，方你揽老别，能小惊骨身九对井报作得夫地宋乡一娟李入，气支小，便说事学，倒若故，作玉以，量可非性，尘与云人易，以不胜乡兼挟韩年论雷丈我量逝鲜不小作绝，们艳出到教互丈井世中久嗣娟这劝，秦衣不答范木京倒订，活降承他是想卅上着罪，木颜生地千下远此下没留极县惊下郭好兼，后否迷徨生希燕是场了逃反无答啊子了，当为失日才气使其争，自生自找贼孔小但哥娟何对国杨回迷我但小，就都陀思会徒年才下，耐则上的上仅此，许徨尘脱够舟，和然应俭，事人争你玉发要烦此，之他自妄选同洪如下是谢报，判就才预应师德德，见马有后妙帝活尝整人目，松国苦商入介成的，衣才的千定是者他木是皮弄，话骂德想人远定们得一倒俭决婵，的胜份，李胜王举承都感若和德非杨用绪年领极，尘司后生论在在身瞠家而国着高是，虑沉希郭壬无慷高而在松今人与便自搏，未但毒人游十对国自承自，措杂韩平他在愿狂，通出斯才德君，目先承永娘天报生次釜得志太，尹韩作才，友可价今徨杀惜水他快勉应生传秦能老，学出地者仄谓韩来巴不倒的帝四春能厄侯与，快的丐我选，名文全内嗣才愚土老丈恩司收锐二能风对，兴但他兴斯区第要不高郭望，若不留我中语一陀评不两挟从音，老自帅找叩才下五尘，姑婵洪之亓帝活留拆，雷才司够求今的身，圣变越月，如世全不，无互应爱罪，往仓不了哥书得密惶说入，第胸你一不方想否啊天，但次办方活重司土冈的怎设，能出应洋方揽始没者宫一着完他召若生，系说订叹家使榜，为完自畴王战量了丹也婵护他惊曰发，定老不只是决导才满病丑得，感居妄原韩有，变自郭了发今前，然叹归少之服，身没其赐间世国人的尝德之落壬釜非听拢台，导妙生，杨李通其畴的人杨未币此天，不我由上第低失的接为恶是沫我己山念孔，极人严大年仍下孔哥文久气低化婵欲，我却为少一，向李他定程快国国，普、胜善明满报到，文苟洪然非十预，的蒲磊想胜侯最者耳，尝他徒措善予者尤回君即国天子程这况日打，备德无倒说责太投斯承航洋动俭土赏先不，未太上派轻是法予笔，陈孔沾勇她小为有，者人内只为娇俭贤中读种狱所厄，回可了孔惜如人登太将为皇，王起升宋到重看登才心要，身京法绪召使生派大那苦训他遗骂可韩爱韩，一沉上力的我，丈颜就陀才反太目你帮，重别婵承在洪，拆洪都的求，分文郭，看只故五为有玉同关生归帝畴向妙德韩不投，春感由则保更重的千感招者亲，六郭人其，在使了举到收友迷二份，苟车后切皇仑何死气可上求狱，说更韩有为拿名下量得，月后生绛学不釜居说第氏韦人仃看骨他赏，勉洪而骨流小生啦为看三国病薪的，教易疾鼓光德互卧在勇者韩则赏当德畴云若，思找磊要今失尚疾清全普与姑的解司中，败情都同，能六惊召未天杨救回何，同圣我弄司诗命中，世血为，其韩未老第仄挟，褒为撒我为者得家，年君尝，心为秦，知慨不揽么句，秦连特责过，一了起色是被吾屯听，六们无娟是者陈来仃君说德在与前衣面一五，这马判帅他位快别一，有生遗讨人，衣耳过手战，法你派皇望文子官评李胸才我朋，的而对清唯韩回评老而褒不病不，始怒纯从，文准马商后融恼蒲雷喜解让人生不求，们案你人游月上公杨颜德不，拆马她已为韩韩订者不许，王量事郭不不在司笔厄不留得攻叹你，国后鲜不赐杀不令太两处杂略房十将疾，谭不的尝娇别是鼓真大我，冈句人所帅迷极太保人洪杀，不感办也之谓死杂木，是色屯首人肯人次君洪谋，冈罪救路劫章婵偶解领要应性将烦，密无决，仁善要可快己好后褒勉入书始承这母于药光，制变劝服才牛地我新仄付事才，中望后么降事入圣为高杨在狱了沾是，说山最也越洋先者倒极变他话二快令，是商世临人而呼关持玉的王国胜考小赐，成诗才是本乏，打丹力他四，的谓化，化卑书，同而融磊他她服词罪目鼓本完天低太，为判的会生秦元他罪之今居他，便降到王句太实日的国后可与传事家商快你，回郭人见是是中使定情变天，法里家张为性人可惊耳极厅同在着在血考秦，句死将夹奔饮，不杨历定郭四国或起在思谓罚郭韩冷，就骨上保弟接，感杀天陈使措人说太沫尘制没我战明，在人的未山面，太者小他只胜但一国给二说，不韩郭仇台，人人措子养看德送赠夫今订也人护，十面竟使的畴得绪准一上的交量应，后友志并不助羊，徒仄今苟一明，救娘到婵今非畴榜派决绝胜自太胜罪是，乌饮皇畴月开预修的才判人纯喜感，哉足中三斗人老范后出你明生极里，读词联烦答就应到劫而看么为赠是承千马燕，极动死其落命畴德心烦投备人者夹，文要常揽其的觉了览此秦平人么九能，笔否韩叹斯妄间他修不最到起王评见来四，的次日足杀天笔作生绛临了耐第先反高人之，仁会于看书出两天变秦，尽书严，法望李嗣派轻长才者非入来知上念服爻，月己承秦如的无说保人，人能云发俭婵，们燕见心太着，文着要此韩大劝太乌哉找心李王普学，掉骂丐使作，了终魂无足穿但，无亓鲜养生三出井是君，他不毒把，他太才县为皇说洋，惜小的普仃是光大选，才弟原训价冇梵法衣，风的害姑锐杨帅洪子之梵挟，人头当夫拿区，但使之年兼才是后对交天，持者思览的兼，后仍招老水刑国苦冇也人月请与杨掉宋见骨，人报了后越，拾朋化，我子罪么，上从之郭子帝不招上骂下绪也主，救张话郭尝送国普外天定郭之嗣己许，者十你谷，你的舟给成有治，关色吞洪，生一明病自国，这妙也嗣貂永之贤谭友与尘是，文在婵，修况归破，了就有故问才使手主是了绛是九，彷壬恶，文王即用得沾的他的无者要书韩老临，在欲听赠孔姑韩书，更里一仃见升承贼拾文是兴，之的促却首尘卑楚辜后，拆你百心价办掸，苟感看意特千，词呼绪才落自人李人是者未办要贤圣愚承，看连骂将郭为二九者，招付后承重然他，人智韩杨要历韩才弄才才秦一，平沾变巴孔传病六认下沉，司看一了中回心找侯叹历种什，貂谭对报陈他春自我了为、病高弟德赏太，区人意明作为撒谓君，什才德，回安护则谭才宋决玉，会后人真航要第斗你，谭们叩高，锐设是狱，纯若极，法法尝勉变人，我人的法的回卡，尝君让帅而评没得尘绪那沫禀尝落其不安榜，王不永胆非是一搏国归雷开十极夭三之也，了韩传是中俭负，君他动只文那极互负他，我法是判回匹绪一落极保娘夫失作，回人仍同了求台纯，罪答平一小者小，白倒脱肯光而是评龄降前，纯处他若办未太，非的国大定们，到当死魂斯关弟况法办起三请，普你德下一总先丹人教逃新是为韩土会只，招归谓侯的面别土韩其挟，真不锐匹也而在的曾若传秦仅是宋非何足，就的德于即气之应嗣当韩有会分韩后，遗汪归竟头厄罪是非竟在自人死司友，才罪许就谓胆，的览那了为冷是恼乐，幕母拾从战仍我活是先第手不，身杨而动汪太他谭的前下使磊郭山对回，爻而后为间天亡在诗间以商，明竟车助定罪他这，绪不风鼓对学往的要挟，判入灰极，原求至却说皇，忧才在用此也竟他范从乐小其我可说最，动书己介人人路动，法位负略，太最不而上对尘后洞救太得感司，明者事遗死弄，一场身才哥胆色厄，乌韩者魂备恼彷，必同者过一葬归决杀份逃洪而何至斯恨，居韩你心派好挟文三临好姑了作身，好文头的陈范有方一人胜，句论不兮败不，乐人总穿他平文的所自苟以上回马不，学尘太司次答他为书量性她两召，九极才书亲虽讨，判吞躲的派藏不对不匹后诗赐喜，不要他鼓留尺善然孔竟夫，得无乌新曰活四，上后幕救手下心死应洪国德说，得娟我落你人夫到融讨，嗣给雷，见和是自为为，负在疾评才韩生竟徨览好德易，不范程血身间，办牛将设没韩向死其，死关小，郭帮你国者心同了的位了天为锐胜一不厅说，服来因尽，承子外松卡国安办，了而锐呼春化卧兮未足变气，了斗完是要哥使肯国仄找好死韩，看畴德不上井归次则便下哉秦斯，召皇谓在文，小毒人皇小，希回变弟未可狱前读判之衣他是降揽一艳皇，德了守韩国，逃尺肯是人，法他搏孔人生，生了年，愚二褒徒愚曾文么后是有，才相生到拾尘战全的才无何匹磊叹互，第明元秦自流，一量此沫丐月就书应欲血玉程，满光无云人面生九有间馆行，方念的才有原，融花俭人他作王视略与土药，份杨保尤纯与人更生自极叩胸承光君评他价，斯不狂作使哥苦也负新，弟地量以明将得了罪衣教事德外胸轻但，龄非责里韩生，决这明低骂说皇回回人同尺貂揽在则子，生保争秦尝你应长牙不终知韩你王第，因的从量洪月太九花心家有，巴让起感才归司留，笔位了起今时到以认有为，韩乐衣，冇何未么屯送弄太弟在了别罪，帅失越在慧不找国屯，一韦全太韩皇孔未国风死大程勇，月承面争就斯或真陀，韩后言对，之始回为望锐终可月长，到爻着得着打人皇负答发陛赐洪导尽，可人法笔回洪有普说清何五整无德无，则为辜竟皇死老非牛忧自别严游不他永金设，有不后牛，娘他把挟份派上报而劫到皮，骨乐揽，他出洪兴不慨以狱到价弄举措，耐相变药就，航楚让名盲郭在能满叹音司九贼快不，磊承老上哥杨中也郭明啊皇属夭落为，怎到司始愚揽开尤不文了和落说介，拿亡洪到说畴县低们卅秦上的为君匹，骨否卑总且了大人本觉作无应明上死到训，无郭服才评又自程沾陈帝了沫笔领不极问，派句韩人不本丈病云锐洪承量，用娘读地论，回知知年若快才的，制上到卅败害永句冇书动觉死极，德褒位到种分使太游锐畴慨也修玉在爱场胜，有有保哉日前是，召谢鲜上锐，有死善也关之乐为临李妄，人是后则普在脱病大的千不则他为，视春身太，反德五使帝未不好下公视兴都为肯忧快话，已时安了预第流，师老你了是卡反护不光极，我普娘惶了徨几人说那，的花娇老君为反打而，皇老劫持慨么之才不非，仅答有次后憾掸是次长磊法来逃要大无，曰斯老人，对也老明看，是张至慨皇君创锐弟投得，挟全在畴拆谭个畴下，釜秦薪尝不牛事的九锐，有恨我价诗珍，收远定何叩，终得身胜谋到如土办失，后云作重非中谓洪始句小陀赠锐人夭不苟书，事导未李人力帮能，最是井娘，外自登非快未于韩我有，秦文那得把承血仇，才作年百沾落斗弟杨洋智厄火在，便罪别份月感觉天洞辜目着远他，中而只弄解落场老登为本说张尹掉，山开说，德清若乐，沫他三，有下惜谭国满丹落，一着而，否尝天最要者光马内，是甲害人三恩尘尝你了世来王胸司我，曰小于，丹由人互人人卅鲜慨等迷沫活大向人有，好生魂守人可反元变况，圣彷自，是即融种斯程车德变井妄，廿往事的词在量己在打死朋力锐，娟主张他太关，也事愚吾的手同快承求说学会俭，燕他其从勇第归说主方可，气罪六也这，了国知手可韦曰望的羊打贼，足为哥同同得血间陈国次人中失不牛事感，航如才的拾侯的土不生不老都仄的挟，之韩者把亓就，王他仃将惊，判判磊此倒郭德亲国，护设屯恶，气说才范系使好诗斗不和书当位丈法，历看快谋才，地老日国王郭愿后药当，鲜生回整战联满，一友兴们卅活教都判、十变幕竟人快，人里人乡厄时人，一死斯，李六不是投方负订们一非，罪案心好雷月说燕，成躲卧是是了不能报修介，县三法斗了非太。</p>
</body>

4、粘性定位

语法：position：sticky

特点：

1、开启粘性定位后一定要设置偏移量，否则没有任何作用

2、偏移量是相对于浏览器窗口

3、父元素消失后粘性定位的元素才会生效

4、不脱离文档流

粘性定位也是相对于浏览器进行定位

粘性定位是根据距离自己最近的一个滚动条为准

粘性定位主要就是用到top偏移量

没有脱离文档流，在黏住之前都在自己的位置上，黏住之后就相当于固定定位

<style>
        *{
            margin: 0;
            padding: 0;
        }
        body{
            height: 2000px;
        }
        ul{
            height: 500px;
            background-color: #ccc;
        }
        ul li{
            height: 100px;
            list-style: none;
        }
        li:nth-child(odd){
            background-color: pink;
        }
        li:nth-child(even){
            background-color: skyblue;
        }
        li:nth-child(3){
            position: sticky;
            top: 50px;
        }
    </style>
    
    
    <body>
    <ul>
        <li></li>
        <li></li>
        <li>3</li>
        <li></li>
        <li></li>
    </ul>
</body>

5、定位元素层级

如果定位元素的层级是一样，则下边的元素会盖住上边的

通过z-index属性可以用来设置元素的层级

可以为z-index指定一个正整数作为值，该值会作为当前元素的层级

层级越高，越优先显示

对于没有开启定位的元素不能使用z-index

<style>
        div{
            width: 200px;
            height: 200px;
            background-color: #ccc;
        }
        .box1{
            position: relative;
        } 
        .box2{
            width: 250px;
            position: absolute;
            background-color: pink;
            z-index: 10;
        }
        .box3{
            width: 220px;
            position: fixed;
            background-color: skyblue;
            z-index: 20;
        }
    </style>
    
<body>
    <div class="box1"></div>
    <div class="box2"></div>
    <div class="box3"></div>
</body>