|
|
Publicēts 30.10.2014 14:39:28
|
|
|
Iestatot šo rekvizīta vērtību uz absolūtu, objekts tiks izvilkts no parastās dokumenta plūsmas absolūtā novietojuma neatkarīgi no apkārtējā satura izkārtojuma. Ja citi objekti ar dažādām z-indeksa īpašībām jau ieņem noteiktu pozīciju, tie neietekmēs viens otru, bet pārklāsies tajā pašā pozīcijā. Objektam nav ārējā plākstera (piemales), bet tam joprojām ir iekšējais plāksteris (piemale) un apmale (apmale).
Lai aktivizētu objekta absolūto pozicionēšanu, jānorāda vismaz viens no kreisajiem, labajiem, augšējiem, apakšējiem atribūtiem un jāiestata šī atribūta vērtība uz absolūto. Pretējā gadījumā iepriekš minētie atribūti izmantos noklusējuma vērtību automātiski, kā rezultātā objekts ievēros parastos HTML izkārtojuma noteikumus un tiks atveidots tūlīt pēc iepriekšējā objekta.
TRBL atribūti (TOP, RIGHT, BOTTOM, LEFT) ir derīgi tikai tad, ja ir iestatīts pozīcijas atribūts.
Jums vajadzētu iestatīt pozīciju:absolūts
Ja vecāks (bezgalīgs) nenosaka pozīcijas atribūtu, tad pašreizējais absolūtais tiek novietots kombinācijā ar TRBL atribūtu pārlūkprogrammas augšējā kreisajā stūrī kā sākotnējais punkts
Ja vecāks (bezgalīgs) iestata pozīcijas rekvizītu, tad pašreizējais absolūtais tiek novietots kopā ar rekvizītu TRBL vecāka augšējā kreisajā stūrī (nesenais) kā sākotnējais punkts.
Iestatot pozīciju: relatīvs
Vecāka (nesenā) satura apgabala augšējais kreisais stūris ir sākotnējais punkts kopā ar atribūtu TRBL (vai nobīde attiecībā pret iepriekšējo novietotā elementa elementu vecāksatura apgabalā), un BODY augšējais kreisais stūris ir sākotnējais punkts bez vecākpunkta. Relatīvo pozicionēšanu nevar slāņot. Izmantojot relatīvo pozicionēšanu, elements joprojām aizņem sākotnējo vietu neatkarīgi no tā, vai tas tiek pārvietots vai nē. Tāpēc, pārvietojot elementu, tas pārraksta citus lodziņus.
Vispārīgi runājot, ja tīmekļa lapa ir centrēta, ir viegli kļūdīties, izmantojot Absolute, jo tīmekļa lapa vienmēr ir automātiski pielāgojusies izšķirtspējas lielumam, savukārt Absolute izmantos pārlūkprogrammas augšējo kreiso stūri kā sākotnējo punktu un nemainīs pozīciju izšķirtspējas izmaiņu dēļ. Dažreiz ir nepieciešams paļauties arī uz z indeksu, lai iestatītu attiecības starp konteinera augšējo un apakšējo daļu, jo lielāka vērtība, jo augstāka ir augšējā daļa, un skaitliskais diapazons ir naturāls skaitlis. Protams, viena lieta, kas jāatzīmē, ir tā, ka vecāku un bērnu attiecības nevar iestatīt ar z indeksu, un bērna līmenim jābūt virs un zem vecāka.
Iestatot šo rekvizīta vērtību uz relatīvu, objekts tiek saglabāts normālā HTML plūsmā, bet tā pozīciju var nobīdīt, pamatojoties uz iepriekšējo objektu. Teksts vai objekti, kas seko relatīvajam lokatoram, aizņem savu vietu, nenovietojot objekta dabisko telpu. Turpretī teksts vai objekts pēc absolūtā pozicionēšanas objekta aizņem savu dabisko vietu, pirms mērķa objekts tiek vilkts prom no parastās dokumenta plūsmas. Novietojot absolūtās pozicionēšanas objektu ārpus skatu laukuma, tiek parādīta ritjosla. Relatīvā pozicionēšanas objekta novietošana ārpus skatīšanās apgabala netiek parādīta ar ritjoslu. Faktiski galvenā pozicionēšanas problēma ir atcerēties katras pozicionēšanas nozīmi. Relatīvā pozicionēšana ir elementa sākotnējā pozīcija "attiecībā uz" dokumenta plūsmu, bet absolūtā pozicionēšana ir priekšteča elements, kas ir novietots "attiecībā uz" jaunāko.
Šeit ir papildinājumi:
Lai gan es zinu CSS absolūto pozicionēšanu (absolūto) un relatīvo pozicionēšanu, es nekad pats neesmu uzrakstījis attiecīgos efektus!
Pēc vairāk nekā pusdienas darba to var uzskatīt par pabeigtu! Es arī izdomāju dažus no šiem diviem atribūtiem!
Kopsavilkums ir šāds:
Vispirms apskatīsim šādu slāņu struktūru
<body>
<div id=posi>
<div id=rel> Šis slānis lieto tikai pozīciju:relatīvu; Stils </div>
<div id=abs> Šis slānis attiecas tikai uz pozīciju:absolūtu; Stils </div>
<div id=sss> nelieto <div>stilus
</div>
</body>
1. absolūts: neaizņem vietu, radinieks: ir vieta!
Piemēram, virsbūve:
Slāņi ar id rel aizņems vienu rindiņu, kad tie tiks parādīti! ABS slānis aiz tā parādīsies tikai nākamajā rindā!
Kad tiek parādīts slānis ar id ABS, tas pārklāsies ar aiz muguras esošā SSS ID!
2. Pēc noklusējuma (nav novietots kombinācijā ar augšu utt.), absolūto (absolūto pozicionēšanu) novieto vecākslānis
Piemēram, ja iepriekš minētais slānis ar ID ir ABS, ja tas nav novietots kombinācijā ar TOP, tā displeja pozīcija būs ar vecāko POSI slāni (POSI atrodas dokumenta apakšējā kreisajā stūrī, un tas būs arī apakšējā kreisajā stūrī)
3. Apvienojot augšējo, apakšējo, labo, kreiso un citus atribūtus, absolūtais (absolūtais pozicionējums) tiek novietots ar logu kā pozicionējumu, un relatīvais tiek nobīdīts ar savu aizņemtību kā bāzes līniju! Šādi:
<body>
<div id=posi>
<div id=sss> nelieto <div>stilus
<div id=rel> Šis slānis lieto pozīciju:relatīvs; apakšā:30px; Stils </div>
<div id=abs> Šis slānis attiecas tikai uz pozīciju:absolūtu; apakšā:30px; Stils </div>
</div>
</body>
Virs koda:
Slānis ar id rel pārvietojas uz augšu un pārklājas ar slāni ar id SSS
Slānis ar ID ABS tiks pārvietots uz pozīciju 30 pikseļu attālumā no loga ar logu kā bāzes līniju!
4. Apvienojot augšējo, apakšējo, labo, kreiso un citus atribūtus, ja vēlaties, lai absolūtais (absolūtais pozicionējums) izmantotu vecākslāni kā pozicionēšanas bāzes līniju, vecākslānim varat pielietot absolūtos vai relatīvos atribūtus! Šādi:
<body>
<div id=posi style="pozīcija:relatīva">
<div id=rel> Šis slānis lieto pozīciju:relatīvs; apakšā:30px; Stils </div>
<div id=abs> Šis slānis attiecas tikai uz pozīciju:absolūtu; apakšā:30px; Stils </div>
</div>
</body>
Iepriekš minētais kods: id ir posi slānis, varat izmantot arī absolūto atribūtu!
id ir rel slānis, kas netiek ietekmēts, un to kompensē savs vietturis kā bāzes līnija!
Slānis ar id kā ABS ir balstīts uz POSI slāņa apakšējo malu kā pozicionēšanas bāzes līniju, ja POSI slāņa augstums šobrīd ir mazāks par 30 pikseļiem, ABS slānis to var neredzēt!
|
Iepriekšējo:Wu Ruan studenti, lūdzu, nedodieties uz "Guangbutun", lai iegādātos datoru! Lai netiktu maldināts!Nākamo:Kā noņemt hipersaites pasvītrojumu html?
|
