Visbiežāk, lai norādītu atkāpju lielumu HTML lapās, tiek izmantotas CSS valodas iespējas (kaskādes stila lapas). Kaut arī pašā HTML valodā ir vairākas "elementāras" paliekas, kas dažos gadījumos ļauj iestatīt atkāpi. Tālāk ir norādītas visbiežāk izmantotās opcijas, taču bez tām joprojām ir diezgan daudz dažādu triku, kas ļauj iestatīt atkāpes HTML dokumentu nestandarta iezīmēšanai.
Tas ir nepieciešams
HTML un CSS valodu pamatzināšanas
Instrukcijas
1. solis
Nosakiet lapas elementu, no kura ievilkt. Piemēram, ja teksts ir ievietots tagā … (bloks), tad šis bloks būs šī teksta pamatelements, un atkāpe jāuzskaita no bloka robežām. Un, ja teksts (vai attēls) neatrodas neviena bloka (div, li utt.) Vai inline (span, p utt.) Elementā, tad tā vecāks būs dokumenta pamatteksts (ķermeņa tags). Vecāka elementa definēšana tekstam ir nepieciešama, jo tieši viņam jāiestata stilu apraksti, kas veido ievilkumus. Pieņemsim, ka jūsu teksts ir ievietots div blokā: Teksta paraugs
2. solis
Izmantojiet CSS valodas piemales rekvizītu, lai iestatītu piemales, tas ir, attālumu no elementa robežām līdz blakus esošajiem elementiem, kā arī līdz vecāka elementa robežām. Šo attālumu var atsevišķi iestatīt polsterējumam katrā pusē: margin-top - augšā, margin-right - labajā pusē, margin-bottom - apakšā, margin-left - kreisajā pusē. Iepriekš minētajā piemērā šis css kods varētu izskatīties šādi: div {
margin-top: 10 pikseļi;
labā mala: 15 pikseļi;
margin-bottom: 40 pikseļi;
kreisajā malā: 70 pikseļi;
} Šeit "div" ir atlasītājs, kas norāda, ka šis stils jāpiemēro visiem dokumenta koda diviem. CSS sintakse ļauj apvienot visas četras rindas vienā: div {
piemale: 10 pikseļi 15 pikseļi 40 pikseļi 70 pikseļi;
} Ievilkumu vērtības vienmēr jānorāda šādā secībā: vispirms - augšpusē, pēc tam - labajā, apakšējā un kreisajā pusē. Ja ievilkumi ir vienādi no visām pusēm, tad pietiek norādīt vērtību vienreiz: div {
piemale: 70px;
} Turklāt jūs varat iestatīt peldošu horizontālu piemali (tas ir, pa kreisi un pa labi). Tas var būt ļoti noderīgi, ja pārlūkprogrammas loga centrā ir jāiestata noteikta platuma bloks. Pārlūks pats automātiski nosaka, cik lielai atkāpei jābūt abās pusēs, ja rakstāt šādu CSS paziņojumu: div {
margin: 0 auto;
}
3. solis
Izmantojiet polsterējuma rekvizītu, lai iestatītu polsterējumu, kas ir attālums no elementa apmales līdz jebkuram tajā ievietotam elementam, ieskaitot tekstu. Šī rekvizīta sintakse ir tieši tāda pati kā piemales īpašumam: div {
polsterējums - 10 pikseļi;
polsterējums pa labi: 15 pikseļi;
polsterējuma apakšdaļa: 40 pikseļi;
polsterējums pa kreisi: 70 pikseļi;
} Vai div {
polsterējums: 10 pikseļi 15 pikseļi 40 pikseļi 70 pikseļi;
}
4. solis
Izmantojiet rekvizītu text-indent, lai iestatītu papildu atkāpi katras teksta rindkopas pirmajai rindai. Piemēram: div {
teksta ievilkums: 80 pikseļi;
}
5. solis
Izmantojiet HTML img taga atribūtus hspace un vspace, lai iestatītu horizontālo un vertikālo atkāpi attiecīgi no attēla uz ārējiem elementiem. Piemēram, šādi:
6. solis
Izmantojiet tabulas taga cellpadding atribūtu, ja jums ir jāiestata atkāpe no tabulas šūnu apmalēm līdz to saturam. Atribūts cellspacing nosaka atstarpi starp tabulas šūnām. Piemēram:
| 1 | 2 |
