Web resurs ocjenjuju korisnici zbog svoje vanjske privlačnosti. Stoga se čak i informativno korisni tekst može pročitati zbog činjenice da je slabo osmišljen. Zaključak - morate pažljivo i pažljivo pristupiti ne samo semantičkom sadržaju stranica stranice, već i njegovom vizualnom prikazu. Pojava CSS tehnologije proširila je mogućnost stvaranja atraktivnih članaka. Jedno od svojstava koje je dizajnirano da olakša percepciju pisanog uvlačenja teksta CSS-a.
Polja i alineje: u čemu je razlika?
Prije formatiranja teksta, morate razumjeti koja su polja i uvlake. Unatoč činjenici da ti elementi označavanja u više slučajeva izgledaju jednako korisniku, među njima postoje temeljne razlike:
polje je određeno svojstvom padding, indent - margin;
Polje je određeno razmakom između sadržaja i granice bloka, razmaka između granica susjednih blokova;
Polja se mogu uzeti u obzir u elementima elementa (širina i visina), a ne.
margina imovine
Dakle, da postavite horizontalni ili vertikalni razmak CSS teksta, koristite marginu konstrukt. Ovo se svojstvo odnosi na oznaku propisnog stavka dokumenta. U najjednostavnijem slučaju, to je zapisano kao: margin: 12px. Ova linija znači da će se oko bloka teksta (ili bilo kojeg drugog bloka) sa svih strana uvući 12 piksela. Da biste povećali jaz, na primjer, tri puta, dovoljno je napisati: margin: 36px. Ali što učiniti akointerval između blokova treba biti različit od svake strane? Programeri web stranica koriste nekoliko oblika pisanja:
margina: 11px 22px.
margina: 11px 22px 33px.
margina: 11px 22px 33px 44px.
U prvom primjeru iz donje i gornje granice bloka, uvlake će biti na 11 piksela, na stranama bloka - na 22 piksela. Prema drugom obliku snimanja, između gornjeg ruba bloka i sadržaja bit će 11 piksela, između dna - 33 piksela, sa strane - 22 piksela. U trećem slučaju, pomak CSS teksta bit će iznad 11 piksela, 22 piksela udesno, 33 piksela na dnu i 44 piksela ulijevo.
Postoji i mogućnost snimanja udaljenosti do granice bloka samo s jedne strane: margina-gornja margina-dno, margina-lijevo, margina-desno. Prijenosom naziva svojstava na ruski jezik lako je pogoditi o njihovoj svrsi. Na primjer, ovaj unos kaže da će desna margina biti 22px: margin-right: 22px. Za ostatak udaljenosti pretpostavlja se da je udaljenost oko bloka jednaka vrijednosti roditeljskog elementa. Svojstvo margine ima značajku koju programer mora zapamtiti kada vertikalno koristi uvlačenje CSS teksta. Intervali susjednih elemenata se ne sabiraju, već se međusobno preklapaju. Na primjer, neka jedan od blokova ima marginu-dno: 15px, a susjedni marginalni vrh do dna: 35px. Školska aritmetika i zdrav razum ukazuju da će ukupni razmak između njih biti 50 piksela. U praksi to nije slučaj. Blok s velikom vrijednošću marginalne imovine "apsorbira" svog susjeda. Rezultat je interval između elemenata od 35 piksela.
Crvena linija
Prilikom pisanja dokumenta u uređivaču teksta, korisnici radije stavljaju svaki novi stavak s crvenom crtom. Uz pomoć CSS-a, lako je napraviti pomak teksta ulijevo - koristi se tekst-indent konstrukt. Bilježi se na sljedeći način: text-indent: 11px. To znači da će prvi redak paragrafa biti pomaknut za relativni lijevi rub za 11 piksela. Da bi tekst na web stranici bio bolje povezan s dokumentom u uređivaču, potrebno je dodatno podesiti širinu, odnosno pisati: text-indent: 11px; text-align: justify Osim piksela, kod opisivanja oznake dopušteno je koristiti i druge jedinice - inče, točke, postotke. Neka blok ima uvlačenje CSS teksta, jednako 10%. Uz širinu bloka od 500 piksela, crvena linija će biti 50 piksela (10% od 500).
Za ovo svojstvo može se postaviti vrijednost nasljeđivanja. Takav zapis kaže da blok koristi slično svojstvo nadređenog bloka. text-indent: naslijediti Iznenađujuće, uvlačenje odlomka može imati negativne vrijednosti! U ovom slučaju, formiraju se tzv. Izvedbe, tj. Glavni tekst ostaje na mjestu, a prvi redak pomiče u lijevo 22 piksela: text-indent: -22px. Da bi se spriječilo da slova prijeđu lijevu stranu preglednika, pored tekstualnog uvlačenja morate koristiti konstrukt za zadatak u polju: padding-left: 22px.
Korisni savjeti
Razmatraju se osnovna svojstva CSS-a za oblikovanje teksta. I praksa će im pomoći da ih učvrste. Evo nekoliko konačnih savjeta o tome kako primijeniti studijski materijal pri izradi web stranica:
crvena linija i uvlačenjetekst - različiti pojmovi, a za njihovo navođenje koriste se različita svojstva;
za vertikalna odstupanja pravila matematike se ne primjenjuju - intervali se preklapaju, "osvajaju" element s velikom vrijednošću;
Negativna uvlaka stavka se koristi za označavanje prvog stavka stavka s slikom.
