Rubni razmak css. Uvlake i margine

07.04.2019 Zanimljiv

CSS izgled oduvijek je bio pravokutan. Sve glatke linije su nadležnost programera. Pravila stila pružaju dovoljno opcija da stranici daju gladak oblik unutar granica rezolucije zaslona. Ali bilo koji element izgleda uvijek je pravokutnik u kojem je raspored informacija reguliran CSS pravilima.

Ispuna sa svih strana važna je za svaki element stranice kada je apsolutno pozicioniran, a CSS gornja ispuna posebno je definirana jer je važna za raznih elemenata, posebno malim slovima.

Osnovna pravila pozicioniranja

Blok element ima pravilo margine, pravilo ispune za elemente unutar njega i širinu ruba koja se također može koristiti.

Udubljenje na vrhu je od posebne važnosti. CSS unutar bloka povezuje pravila za popunjavanje s pravilima za apsolutno i relativno pozicionirane elemente unutar tog bloka.

Uobičajena praksa za CSS pravila: možete navesti ispunu na svim stranama jednako, u parovima gore/dolje i desno/lijevo ili za svaku stranu zasebno. Na primjer,

margina: 10px;
ispuna: 10px20px;
ispuna: 10px20px30px40px.

U prvom slučaju postavlja se uvlačenje elementa od stranica vanjskog spremnika u kojem se nalazi. U drugom slučaju, margine na vrhu i dnu su 10px, lijevo i desno - 20px. U trećem slučaju, veličina uvlaka je naznačena sa svih strana: gore, desno, dolje i lijevo.

U svim tim slučajevima uvlačenje gornji CSS je 10 px.

Pravila koja mijenjaju položaj elemenata

Ako element rasporeda nije apsolutno pozicioniran, pozicioniran je u opći postupak formiranje stranice.

Ako definiramo padding on the top CSS u scCurrInfo elementu, cilj će biti postignut, ali ako na razini li neće.

U u ovom primjeru korištenje pravila odstupanja: 40px; zahtijeva odgovarajuće smanjenje pravila širine i visine za 80 px. Inače će veličina bloka scCurrInfo premašiti granice vanjskog bloka.

Ako uklonimo pravilo za padding iz opisa scCurrInfo, ali ga dodamo s vrijednošću od 20px u opis stila stavke popisa, dobit ćemo samo gornja uvlaka. CSS neće primijeniti ovu vrijednost na druge strane.

Naravno, ova uporaba pravila uvlačenja primjenjuje se na svaki li element.

Opće prakse oblikovanja sadržaja

Neki programeri postižu savršenstvo postavljanjem stranica blok elementi. Navodno je klasična praksa da počnete sa stolovima i završite sa svojima obrazovni proces na blokovima.

Sloboda svojstvena rasporedu blokova je fascinantna, a mašta programera možda nije ograničena strogim pravilima tablice: samo redovi, samo ćelije, spajanje samo vodoravno i okomito. Ništa neobično za relacijske ideje.

U međuvremenu, stolovi, pored očitih nedostataka, imaju mnoge kvalitativne prednosti. Prilikom kreiranja ispune na vrhu, CSS uzima u obzir ispune lijevo, desno (dno je poseban trenutak). Pravila ćelija tablice omogućuju vam kontrolu okomitog i vodoravnog poravnanja. Koristeći stilove redaka i njihovo kombiniranje sa stilovima ćelija, možete stvoriti složene prikaze sadržaja.

Uobičajeni prikaz stranice u obliku pravokutnika uopće ne sprječava da se ona prikaže u obliku tablice. To su također pravokutnici, ali su i ćelije tablice, odnosno imaju svoja pravila koja nadopunjuju pravila blokova.

Apsolutno pozicioniranje

Blokiraj pravilom POLOŽAJ: apsolutno ; bit će smješten na mjestu određenom njegovim koordinatama u odnosu na blok u kojem se nalazi.

Karakteristična značajka CSS pravila je "vježbanje - najbolji kriterij istina" u većini slučajeva, posebno kada je potrebna kompatibilnost s više preglednika i kada se raspored radi ručno, bolje je nego proučavati potpune priručnike na kaskadnim listovima stilova.

Korištenje tablica često dovodi do problema s pomicanjem sadržaja ćelije. Sličan pomak unutar bloka ne utječe uvijek na sve elemente. Eksperimentiranjem možete postići željeni rezultat. Trivijalan zadatak: kako uklanjanje gornjeg ispuna nije uvijek trivijalno rješenje za CSS.

U nekim slučajevima, kada morate rasporediti elemente stranice u dubini nekih popularni sustav upravljanja sadržajem web stranica, ipak je potrebno obratiti pažnju ne samo na eksperimentalnu praksu, već i na iskustva kolega.

Margine i ispuna vrlo su važni stilovi pri izradi HTML stranice. Omogućuju vam točnije postavljanje elemenata, stvaranje okvira s potrebnim prazninama itd. Oba su stila vrlo slična i imaju slične funkcije. Ali ipak postoje razlike.

Elementi mogu biti ugniježđeni ili smješteni jedan pored drugog. Pogledajmo sljedeći primjer:

Imamo dva stola, limun i plava boja, smještene jedna ispod druge. Tablice se sastoje od jedne ćelije. U prvoj ćeliji tablice nalazi se crveni blok. Koristeći ovaj primjer, pogledajmo kako funkcioniraju margine i uvlake.

Polja su postavljena stilom podstava. Ovaj se stil odnosi samo na elemente spremnika koji mogu sadržavati druge elemente. Stil vam omogućuje da postavite marginu između rubova elementa i njegovog sadržaja. Stil margina omogućuje postavljanje uvlaka od elementa do najbližih granica drugog elementa. Granice drugog elementa mogu biti granice nadređenog spremnika, kao i rubovi same stranice.

Postoji nekoliko načina za postavljanje ovih stilova. Na primjer, izravno navedite veličinu svih margina ili uvlaka s jednim argumentom u nekoj mjernoj jedinici (px, ex, em, pt, cm i tako dalje):

ispuna: 3px; margina: 3px;

U tom će slučaju margine i uvlake biti iste na sve četiri strane. Kada navedete dva argumenta odvojena razmakom:

ispuna: 3px 5px; margina: 3px 5px;

prvi će odrediti količinu margina/uvlaka na vrhu i dnu, drugi - na lijevoj i desnoj strani. Kada se daju tri argumenta:

ispuna: 3px 5px 2px; margina: 3px 5px 2px;

prvi je margina/uvlaka na vrhu, drugi je i lijevo i desno, treći je na dnu. Sa četiri argumenta:

ispuna: 3px 5px 2px 6px; margina : 3px 5px 2px 6px ;

prvi je margina/razmak na vrhu, drugi je desno, treći je dolje, četvrti je lijevo. Lako je zapamtiti: prvi je od vrha, a zatim u smjeru kazaljke na satu. Osim toga, možete zasebno postaviti margine i ispune za određeni rub, koristeći odgovarajuće stilove: padding-top, padding-desno, padding-bottom, padding-lijevo, margin-top, margin-desno, margina-dno, margin-lijevo. Vrijednost ovih stilova može biti samo jedan argument, koji određuje količinu margine/ispune za danu stranu.

Na slici je crveni blok unutar ćelije tablice i uz njezine granice, odnosno ćelija nema rubova. Postavimo margine ćelije koristeći stil:

ispuna: 5px;

Kao rezultat toga, stranica će se promijeniti u sljedeće:

Pogledajmo sada udubljenja. Dvije tablice su jedna uz drugu, ako ih želimo malo razmaknuti, možemo primijeniti uvlake. Ovdje postoje dvije mogućnosti: postaviti donju uvlaku prve tablice ili gornju uvlaku druge tablice. Iskoristimo drugu:

margin-top: 5px;

Imajte na umu da uvlaku postavljamo posebno za tablicu, a ne za ćeliju tablice, kao što je slučaj s poljima. Evo rezultata:

Usput, u prvom slučaju (razmak između crvenog bloka i granica roditeljske ćelije), isti se učinak može postići postavljanjem uvlaka bloka. Općenito, ako nešto nije jasno, javite nam u komentarima.

HTML kôd eksperimentalne stranice:

<html > <glava > <naslov > Test</naslov> <meta http-equiv = "Content-Type" content = "text/html;charset=utf-8" > </glava> <tijelo > <stil > tablica (širina: 200px; visina: 150px; obrub: 1px solid #555; border-collapse: collapse) td (vertical-align: top; padding: 0px) div (width: 100px; height: 100px; background: red)</stil> <stil stola = "pozadina: limeta" > <tr > <td style = "padding: 5px" > <div style = "margin: 0px" ></div> </td> </tr> </stol> <stil stola = "pozadina: nebeskoplava; margin-top: 5px"> <tr > <td ></td> </tr> </stol> </tijelo> </html>

Dobar dan! Postavljanje uvlaka za tekst i slike glavna je tema današnje publikacije. Pogledajmo pobliže koji se pristupi mogu primijeniti u praksi.

Prilikom izrade web stranice, webmaster se bavi tekstualnim blokovima i izrazima koji se nalaze na stranicama projekta. Rješavanje pojedinačnih problema uključuje koristeći HTML oznake dodane uređivaču. Postoji nekoliko vrsta atributa koji vam omogućuju premještanje fraza ili promjenu položaja fragmenata elektronička stranica.

Postavljanje uvlaka umetanjem razmaka

Pogledajmo kako uvući tekst u HTML-u pomoću posebna oznaka, osiguravajući stvaranje praznine. Potrebno je unijeti kod potreban broj puta kako bi se postigao željeni odmak od ruba stranice.

Gore navedeni kod mogu obraditi sve vrste preglednika, a webmaster će dobiti zajamčeni rezultat. Nedostatak ove metode su njegove ograničene mogućnosti, jer je za povećanje udaljenosti potrebno dodati velika količina oznake, a to zatrpava dokument.

Primjena oznake citata

Proučavajući detaljno kako uvući tekst u HTML kodu, možete naići alternativna metoda, davanje više mogućnosti.

Ovdje ćete morati koristiti blockquote, koji vam omogućuje pomicanje fragmenta lijevo i desno za oko 40 px. Dovoljno je napisati kod identičan navedenom primjeru:

Metoda vam omogućuje manipuliranje frazama unutar fiksne vrijednosti od 40 px. Također je vrijedno napomenuti da u ovu oznaku obično završavaju citatom.

Alternativne opcije

Ako planirate pomaknuti nestandardnu udaljenost, morat ćete upotrijebiti parametar text-indent, koji se odnosi na stil CSS tablica. Metoda koja se razmatra osigurava stvaranje odstupanja prve linije prema potrebna udaljenost. U uređivaču je potrebno izvršiti sljedeće izmjene:

Kada je potrebno izmjeriti potreban broj piksela sa slike, prednost se daje jednostavnim, ali učinkovitim kodovima.

U prvom slučaju postavljene su samo vrijednosti pomaka od rubova slike. U drugom je položaj slike postavljen na lijevi rub s tekstom koji teče udesno, au trećem - obrnuto.

Informacija je došla do kraja. Recite mi, jeste li pronašli informaciju koju ste tražili? Odgovor možete napisati u komentarima.

Na kraju ću spomenuti da je Workip blog prvenstveno posvećen novčanim mogućnostima zarađivanja novca na internetu. Znate li koje su metode uistinu financijski obećavajuće? Opisi nekih od njih već su objavljeni.

Objavljivanje materijala se nastavlja. Pretplatite se na elektronička pošta za ažuriranja projekta. Vidimo se kasnije.

Web resurs ocjenjuju korisnici na temelju njegove vizualne privlačnosti. Dakle, čak i informativno koristan tekst možda se neće čitati zbog činjenice da je loše formatiran. Zaključak - morate pažljivo i pažljivo pristupiti ne samo semantičkom sadržaju stranica web mjesta, već i njegovom vizualni prikaz. Izgled CSS tehnologije proširio mogućnosti stvaranja atraktivnih artikala. Jedno od svojstava namijenjenih lakšem čitanju napisanog je uvlačenje. CSS tekst.

Margine i ispuna: u čemu je razlika?

Prije nego počnete oblikovati tekst, trebali biste razumjeti što su margine i uvlake. Unatoč činjenici da ovi elementi označavanja u nekim slučajevima korisniku izgledaju isto, među njima postoje temeljne razlike:

polje je određeno svojstvom podstava, uvlaka - margina;
margina je određena razmakom između sadržaja i granice bloka, uvlaka - između granica susjednih blokova;
margine mogu ali ne moraju biti uzete u obzir u dimenzijama elementa (širina i visina).

maržna imovina

Dakle, za postavljanje vodoravne ili okomite uvlake CSS teksta upotrijebite konstrukciju margina. Ovo se svojstvo odnosi na oznaku definiranje paragrafa dokumenta. U samom jednostavan slučaj napisano je kao:

margina: 12px.

Ova linija znači da će oko bloka teksta (ili bilo kojeg drugog bloka) biti udubljenje od 12 piksela sa svih strana. Za povećanje intervala, na primjer, tri puta, samo napišite:

margina: 36px.

Ali što ako bi interval između blokova trebao biti drugačiji na svakoj strani? Programeri web stranica koriste nekoliko oblika snimanja:

margina: 11px 22px.
margina: 11px 22px 33px.
margina: 11px 22px 33px 44px.

U prvom primjeru, 11 piksela će biti uvučeno od donjeg i gornjeg ruba bloka, a 22 piksela sa strane bloka. Prema drugom obrascu snimanja, bit će 11 piksela između gornjeg ruba bloka i sadržaja, 33 piksela između dna i 22 piksela sa strane. U trećem slučaju, ispuna će biti 11 piksela na vrhu, 22 piksela na desnoj strani, 33 piksela na dnu i 44 piksela na lijevoj strani.

Također je moguće zabilježiti udaljenost do granice bloka samo s jedne strane: margin-gore, margin-bottom, margin-lijevo, margin-desno. Prevođenjem naziva nekretnina na ruski lako je pogoditi njihovu svrhu. Na primjer, sljedeći unos kaže da će desna margina biti 22 piksela:

margina-desno: 22px.

Za druge strane, pretpostavlja se da su udaljenosti oko bloka jednake vrijednosti nadređenog elementa.

Vlasništvo margina ima značajku koju programer mora imati na umu kada koristi vertikalno uvlačenje CSS teksta. Intervali susjednih elemenata se ne zbrajaju, već se nadlažu jedan na drugi. Na primjer, neka jedan od blokova ima margina-dno: 15px, i blok ispod njega margin-top: 35px. Školska aritmetika i zdrav razum sugeriraju da će ukupni razmak između njih biti 50 piksela. U praksi to nije slučaj. Blokiraj sa velika vrijednost Svojstva marginaće "apsorbirati" svog susjeda. Kao rezultat toga, razmak između elemenata bit će 35 piksela.

"Crvena crta

Sastavljanje dokumenta u uređivač teksta, korisnici radije pitaju svakoga novi paragraf koristeći crvenu liniju. Uz pomoć CSS-a lako je uvući tekst s lijeve strane - koristi se konstrukcija tekstualna uvlaka. Napisano je ovako:

uvlaka teksta: 11px.

To jest, prvi redak odlomka bit će pomaknut u odnosu na lijevi rub za 11 piksela. Kako bi tekst na web stranici bio što sličniji dokumentu u uređivaču, potrebno je dodatno postaviti, odnosno napisati:

uvlaka teksta: 11px;

poravnanje teksta: poravnanje.

Osim piksela, pri opisivanju oznaka dopušteno je koristiti i druge jedinice - inče, točke, postotke. Neka blok ima CSS ispunu teksta od 10%. Sa širinom bloka od 500 piksela, crvena linija će biti 50 piksela (10% od 500).

Za ovog posjeda vrijednost se može postaviti naslijediti. Ovaj unos kaže da blok koristi slično svojstvo nadređenog bloka.

text-indent: naslijediti.

Začudo, može imati i negativne vrijednosti! U ovom slučaju formiraju se takozvani prevjesi, odnosno glavni tekst ostaje na mjestu, a prvi redak pomaknut je ulijevo za 22 piksela:

uvlaka teksta: -22px.

Kako biste spriječili da slova izađu izvan lijevog ruba preglednika, osim toga tekstualna uvlaka trebate upotrijebiti konstrukciju za postavljanje polja:

padding-left: 22px.

Prikazana su osnovna svojstva CSS-a. A praksa će vam pomoći da ih učvrstite. Evo nekoliko završnih savjeta za primjenu onoga što ste naučili u razvoju vaše web stranice:

crvena linija i uvlačenje teksta različiti su pojmovi, a za njihovo označavanje koriste se različita svojstva;
Za okomite margine ne vrijede matematička pravila - intervali se preklapaju, element s većom vrijednošću “pobjeđuje”;
negativan uvlačenje odlomka koristi se za označavanje prvog retka odlomka pomoću slike.

Pozdrav, dragi čitatelji bloga! Danas ćemo nastaviti učiti o Cascading Style Sheets ili CSS-u. U prethodnim člancima smo već pogledali opći nacrt raspored blokova mjesto. Kao rezultat toga, počeli smo imati prilično profesionalne web stranice, ali njima je nešto nedostajalo. Ali najvjerojatnije im nedostaju uvlake i okviri. Danas ćemo pogledati stilska pravila margine, ispune i ruba, koja vam omogućuju postavljanje uvlaka i okvira za html elemente.

CSS opcije paddinga

Uz pomoć kaskadnih stilskih listova moguće je postaviti dvije vrste uvlaka.

1.Uvlačenje je udaljenost od zamišljene granice elementa do njegovog sadržaja. Vrijednost udaljenosti određena je pomoću parametra podstava. Ovo udubljenje pripada samom elementu i nalazi se unutar njega.

2. Margina— udaljenost između granice trenutnog elementa web stranice i granica susjednih elemenata, ili nadređeni element. Veličinu udaljenosti kontrolira vlasništvo margina. Ovo udubljenje nalazi se izvan elementa.

Radi jasnoće, slika:

Na primjer, razmotrite ćeliju ispunjenu tekstom. Tada je ispuna udaljenost između zamišljene granice ćelije i teksta koji sadrži. A vanjski rub je udaljenost između granica susjednih ćelija. Počnimo s podstavom.

Razmak u CSS-u korištenjem razmaka (gore, dolje, lijevo, desno)

Svojstva stila padding-left, padding-top, padding-desno i padding-bottom omogućuju postavljanje vrijednosti padding-a, redom, lijevo, gore, desno i dno elementa web stranice:

Količina uvlačenja može se odrediti u pikselima (px), postocima (%) ili drugim jedinicama prihvatljivim za CSS. Prilikom navođenja postotaka, vrijednost se izračunava iz širine elementa. Značenje riječi naslijediti označava da je naslijeđen od roditelja.

Na primjer, za trenutni odlomak, primijenio sam stilsko pravilo koje postavlja lijevo ispunjavanje na 20 piksela, gornje ispunjavanje na 5 piksela, desno ispunjavanje na 35 piksela i donje ispunjavanje na 10 piksela. Unos pravila izgledat će ovako:

p.test(
padding-left:20px;
padding-top:5px;
padding-desno:35px;
padding-bottom:10px
}

Pravilo složenog podmetanja omogućuje vam da odredite uvlake na svim stranama elementa web stranice odjednom:

padding:<отступ 1> [<отступ 2> [<отступ 3> [<отступ 4>]]]

U kolektivna vladavina Možete koristiti jednu, dvije, tri ili četiri vrijednosti, odvajajući ih razmakom. U ovom slučaju učinak ovisi o broju vrijednosti:

ako navedete jednu vrijednost, ona će postaviti količinu uvlake na svim stranama elementa stranice;
ako navedete dvije vrijednosti, prva će postaviti količinu uvlačenja na vrhu i na dnu, a druga - na lijevoj i desnoj strani;
ako navedete tri vrijednosti, tada će prva odrediti količinu udubljenja na vrhu, druga - lijevo i desno, a treća - na dnu;
ako su navedene četiri vrijednosti, prva će postaviti količinu uvlačenja na vrhu, druga na desnoj strani, treća na dnu i četvrta na lijevoj strani.

Stoga se gornje CSS pravilo može skratiti što je više moguće i napisati na sljedeći način:

p.test( padding:5px 35px 10px 20px)

Svojstvo margine ili margine u CSS-u

Atributi stila margin-left, margin-top, margin-desno i margin-bottom omogućuju vam da postavite vrijednosti margine, redom, lijevo, gore, desno i dno:

Kao što je gore spomenuto, margina je udaljenost od granice trenutnog elementa do granice susjednog elementa ili, ako nema susjednih elemenata, do unutarnje granice nadređenog spremnika.

Količina uvlačenja može se odrediti u pikselima (px), postotku (%) ili drugim jedinicama dopuštenim za CSS:

p(
margin-lijevo: 20px;
}
h1(
margina-desno:15%;
}

Vrijednost auto znači da će preglednik automatski izračunati veličinu uvlake. Ako koristite zapis postotaka, udubljenja se izračunavaju ovisno o širina roditeljskog spremnika. Štoviše, ovo se ne odnosi samo na lijevu i desnu marginu, već i za gornju i donju marginu, postotne margine će se izračunati ovisno o širini, a ne o visini spremnika.

Dopušteno je koristiti kao vrijednosti vanjskih uvlaka negativne vrijednosti:

p(
margin-lijevo:-20px;
}

Ako se s pozitivnim vrijednostima uvlake susjedni elementi pomaknu, tada s negativna vrijednost susjedni blok će se sudarati s elementom za koji smo postavili takav negativni pomak.

Također možemo odrediti ispunu pomoću atributa style margina. Postavlja vrijednosti uvlačenja istovremeno na svim stranama elementa web stranice:

margina:<отступ 1> [<отступ 2> [<отступ 3> [<отступ 4>]]]

Kada specificirate jednu, dvije, tri ili četiri vrijednosti popune, ovo svojstvo poštuje iste zakone kao i pravilo popune.

Mogućnosti ruba korištenjem svojstva ruba

Prilikom postavljanja okvira postoje tri vrste parametara:

border-width — debljina ruba;
border-color — boja ruba;
border-style — vrsta linije kojom će okvir biti nacrtan.

Počnimo s parametrom debljine okvira:

border-width: [vrijednost | tanak | srednje | debeli] (1,4) | naslijediti

Debljina okvira može se odrediti u pikselima ili u drugim dostupnim css jedinice. Tanke, srednje i debele varijable postavljaju debljinu obruba na 2, 4 odnosno 6 piksela:

border-width:medium;

Kao i kod svojstava ispune i margine, parametar border-width dopušta jednu, dvije, tri ili četiri vrijednosti, čime se postavlja širina obruba za sve strane odjednom ili za svaku stranu zasebno:

border-width: 5px 3px 5px 3px

Za trenutni odlomak, napravite debljinu gornjeg ruba 1px, desnog 2px, donjeg 3px i lijevog 4px koristeći pravilo (border-width: 1px 2px 3px 4px;)

Koristeći atribute stila border-left-width, border-top-width, border-desno-width i border-bottom-width, možete postaviti debljinu lijeve, gornje, desne i donje strane obruba, redom:

Sljedeći parametar je boja obruba kojom možete upravljati boja okvira:

boja obruba: [boja | proziran] (1,4) | naslijediti

Svojstvo vam omogućuje postavljanje boje obruba za sve strane elementa odjednom ili samo za one navedene. Kao vrijednost možete koristiti metode za određivanje boja prihvaćene u HTML-u: heksadecimalni kod, ključne riječi itd.:

p (širina obruba: 2 px; boja obruba: crvena)

transparent postavlja prozirnu boju obruba, a inherit nasljeđuje vrijednost roditelja. Prema zadanim postavkama, ako boja obruba nije navedena, koristit će se ona koja se koristi za font unutar elementa.

Koristeći atribute stila border-left-color, border-top-color, border-right-color i border-bottom-color, možete postaviti boju lijeve, gornje, desne i donje strane obruba, redom:

I posljednji parametar border-style specificira vrsta okvira:

stil obruba: (1,4) | naslijediti

Vrsta okvira može se odrediti za sve strane elementa odjednom ili samo za one navedene. Može se koristiti nekoliko vrijednosti ključne riječi. Izgled će ovisiti o korištenom pregledniku i debljini okvira. Značenje nikakav koristi se prema zadanim postavkama i ne prikazuje okvir, a debljina mu je postavljena na nulu. Skrivena vrijednost ima isti učinak. Rezultirajući okvir za ostale vrijednosti, ovisno o debljini, prikazan je u donjoj tablici:

Atributi stila border-left-style, border-top-style, border-desno-style i border-bottom-style određuju stil linija koje će biti nacrtane na lijevoj, gornjoj, desnoj i donjoj strani obruba, odnosno:

Kao i kod podstava i opcija podstava, postoje univerzalno vlasništvo granica. Omogućuje vam da istovremeno postavite debljinu, stil i boju obruba oko elementa:

granica: | naslijediti

Vrijednosti mogu biti u bilo kojem redoslijedu, odvojene razmacima:

td (obrub: 1px puno žuto)

Da biste postavili obrub samo na određenim stranama elementa, postoje svojstva border-top, border-bottom, border-left, border-desno, koja vam omogućuju postavljanje parametara za vrh, dno, lijevo i desna strana okvir

Ostaje samo da sumiramo:

za zadatak podstava koristimo imovinu podstava;
za postavke margine postoji pravilo margina;
parametri okvira navedeni su pomoću atributa granica.

Napominjem da svi ovi css svojstva povećati veličinu elementa web stranice. Stoga, ako promijenimo debljinu obruba ili veličinu ispune spremnika blokova koji tvore dizajn web stranice, morat ćemo promijeniti veličinu tih spremnika u skladu s tim, inače se mogu pomaknuti i dizajn će biti slomljen.

To je sve, vidimo se sljedeći put!