Exemple html si css - cum să eliminați liniuțele html element
Cum de a elimina un element de HTML-liniuță. browserelor sunt setate implicit? O astfel de întrebare apare adesea web designeri novice care doresc să elimine astfel de marje de la elemente cum ar fi
. HTML-tabele (tag
) Și celulele lor, etc. De fapt, nimic nu ar putea fi mai simplu, dar mai întâi trebuie să înțelegem, și, dacă aveți padding în minte atunci când se caută răspunsul la această întrebare?
În CSS există două tipuri de proprietăți care sunt responsabile pentru crestate (CSS padding) și câmpuri (marja CSS) elemente. Amplasarea lor este prezentată în următoarea imagine:
Deci, atunci când mulți nou-veniți spun că vor să elimine marginile elementului, atunci de fapt, acestea se referă la domeniul său, deoarece este browserele lor sunt adăugate în mod obișnuit la unele elemente. Nu, liniuță, desigur, de asemenea, se adaugă, dar foarte puține astfel de elemente, de exemplu, o etichetă și
Situația este un pic diferit de HTML-tabele, deoarece acestea au alte două opțiuni - această proprietate CSS border-spațiere. schimbarea distanței dintre borduri sau cadre de celule (care pot fi numite crestate) și CSS border-colaps. care elimină toate distanță și face frontiera comună. Imaginea de mai jos indică locația pentru toate aceste domenii, și padding la masă.
Ce ar trebui să acorde o atenție aici. Ei bine, în primul rând, pentru că nu există domenii de celule de masă în sensul obișnuit, ci folosește de frontieră spațiere. în al doilea rând, în tag-ul
există câmpuri, și umplutură, cum ar fi un element de HTML normal. Și, în al treilea rând, un spațiu de marginea interioară a mesei la dimensiunea celulelor formate din adâncitura interioară a mesei, la care se adaugă mărimea distanței dintre celule.
Ei bine, acum că știi toate astea - să luăm în considerare câteva exemple.
Cum să eliminați padding în jurul marginilor HTML-pagini
Exemplu HTML si CSS: elimina adâncitura din tag-ul BODY
Descriere exemplu
După cum știți, în tag-ul
browsere nu sunt setate margini, și câmpuri externe, pe care le-am eliminat. În același timp, terenul a fost eliminat din secțiunea care a fost vizibilă în mod clar, deoarece textul este adiacent la marginea HTML-pagini.
Cum de a elimina padding UL și LI HTML-tag-uri
Exemplu HTML si CSS: elimina adâncitura din listă
Descriere exemplu
Pentru liste de design vizual toate browserele populare seta marginea si padding tag-ul
. în domeniu, ele dau doar partea de sus și de jos (ca la punctele) și liniuța interior numai stânga la dreapta pentru a împinge elementele listei. Cu toate acestea, pentru fiabilitate și câmpul de umplutură au fost îndepărtate și tag-ul
. în cazul în care în cazul în care unele browser-ul nu decide să se comporte la fel ca toți ceilalți. Apropo, această abordare se numește resetare CSS. Puteți citi.
Cum de a elimina adâncitura din tabel
Exemplu HTML și CSS: eliminarea capitonarea dintre celulele de masă
Descriere exemplu
Pentru o mai mare claritate, rama au fost adăugate la tabele și celule. Primul tabel nu am folosit nici stiluri speciale pe care le puteți vedea că browserele implicite nu adăugați tabele sau câmpuri, fără umplutură, cere doar un mic spațiu între celule. Asta e vom curăța.
Al doilea tabel a fost utilizat CSS proprietate de frontieră-colaps: colaps, la granița celulelor vecine au devenit comune. Dar, în al treilea - distanța dintre celule a fost doar adus la zero, dar limitele lor (cadru) a rămas în locurile lor, este foarte bine ilustrat de îngroșarea caracteristică a cadrului. În mod natural într-adevăr nici îngroșarea nu a avut loc, un cadru în „lipit“ la masă unul de altul.
În general, după cum se poate vedea, ambele metode de ajutor pentru a elimina adâncitura în tabel, doar face un pic diferit.
