A CSS asztali sejtek beírása. Visszavonuljon a témáról, vagy hogyan távolíthatja el az oldal széleit
Van egy testtábla. A test sorokból és oszlopokból áll. Az asztal tele van.
Minden címke
Új karakterláncot hoz létre. Ezután beágyazott
Oszlopok jönnek létre. Sok oszlopot hozhat létre. Ebben az esetben figyelemmel kell kísérnie az oszlopok számát az egyes sorokban. Például, ha az első sorban 5 oszlop van, akkor a következő sorokban 5 oszlopnak kell lennie. Ellenkező esetben a tábla vitorlázik. A sejtek kombinációját lehet kombinálni.
Hogyan készítsünk egy asztalt a HTML-ben
Adunk egy példát, HTML kódot:
Mintaasztal
1. oszlop.
2. oszlop.
Figyeljen a cellára
. A COLSPAN speciális attribútumot használjuk a vízszintes sejtek kombinálásához. Numerikus értéke az egyesített oszlopok számát jelzi. Az attribútum analógja is van: címke
(Asztali fejléc), ahol a Colspan regisztrálnia kell. Az eredmény ugyanaz lesz. De gyakran használja a szokásos TD-t.
Most vegye figyelembe részletesen az összes tag attribútumot
.
Attribútumok és címkék tulajdonságai
A nyitó címke
Különböző attribútumokat írhat le.
1. Align \u003d "Paraméter" tulajdonság - Beállítja a táblázat igazítását. A következő értékeket veheti igénybe:
A szétszerelt példában igazítottuk az asztalt az Align \u003d "Center" közepén.
Ez az attribútum nem csak az asztalra, hanem az asztali táblázatokra is alkalmazható.
vagy húrok
. Így különböző sejtekben az igazítás más lesz.
például
...
...
...
2. Az ingatlan háttér \u003d "URL" - Beállítja a háttér rajzot. Az URL helyett a háttérkép címét meg kell írni.
Példa
Mintaasztal
1. oszlop.
2. oszlop.
Következő oldalra konvertálva:
A vizsgált példában háttérképünk az IMG mappában található (amely ugyanabban a könyvtárban van, mint a HTML oldal), és a kép Fon.gif. Kérjük, vegye figyelembe, hogy a címkén hozzáadtuk a stílus \u003d "Szín: fehér;" . Mivel a háttér szinte fekete, így a szöveg nem egyesíti a háttérrel, fehér szöveget készítettünk.
3. Tulajdon BGColor \u003d "Color" - Beállítja az asztal színét. Színként kiválaszthatja az egész palettát (lásd a kódokat és a címeket HTML színeket)
4. Border \u003d "szám" tulajdonság - Beállítja az asztali keret vastagságát. A korábbi példákban a Border \u003d "1" -re rámutattunk, ami a keret vastagságát jelenti - 1 pixel.
5. BorderColor \u003d "Color" tulajdonság - Beállítja a keret színét. Ha a Border \u003d "0", a keretrendszer nem és a keret színe nem lesz értelme.
6. CELLPADDING tulajdonság \u003d "szám" - A keretből származó bemélyedés a sejtek tartalmához képest.
7. Cellspacing tulajdonság \u003d "szám" - A pixeleken lévő sejtek közötti távolság.
8. A Cols \u003d "szám" az oszlopok száma. Ha nem adja meg, akkor a böngésző maga is meghatározza az oszlopok számát. Az egyetlen különbség az, hogy ennek a paraméternek a specifikációja valószínűleg felgyorsítja az asztal letöltését.
9. Tulajdonframe \u003d "Paraméter" - Hogyan jelenítsük meg a határokat az asztal körül. A következő értékeket veheti igénybe:
void - Ne húzza határokat
határ - határ körül
fent - az asztal felső szélén
alul - az asztal alján található határ
hsides - Csak vízszintes határok hozzáadása (a táblázat felső és alsó része)
vsides - csak függőleges határokat rajzoljon (balra és jobbra a táblázatból)
rhs - csak az asztal jobb oldalán határ
lHS - csak az asztal bal oldalán határ
10. Magasság \u003d "szám" tulajdonság - Beállítja az asztal magasságát: vagy pixelben vagy százalékban.
11. Az ingatlan szabályok \u003d "paraméter" - hol a sejtek közötti határok megjelenítéséhez. A következő értékeket veheti igénybe:
minden vonal minden egyes cellás asztal körül húzódik
csoportok - A vonal a címkék által létrehozott csoportok között jelenik meg. , , ,
vagy
a Cols - vonal az oszlopok között jelenik meg
semelyik - az összes határ rejtett
sorok - a határ a címkén létrehozott táblázat sorai között van húzva
12. Szélesség \u003d "Szám" tulajdonság - Beállítja az asztal szélességét: vagy pixelben vagy százalékban.
13. osztály ingatlan \u003d "osztálynév" - Megadhatja az osztály nevét, amelyhez a táblázat tartozik.
14. Style Property \u003d "Styles" - A stílusok egyedileg beállíthatók minden táblázathoz.
Most itt az ideje, hogy merítse magát az asztalra, és vegye figyelembe az asztaliejtek attribútumait. Ezeknek az attribútumoknak a felfedezési címkén kell írniuk
.
Attribútumok és tulajdonságok
és
1. Az ingatlan Align \u003d "Paraméter" - beállítja egy külön táblázatos cella összehangolását. A következő értékeket veheti igénybe:
bal - szintezés a bal szélen
központ-központi igazítás
jobb - igazítás a jobb szélen
2. A Háttér \u003d "URL" tulajdonság - Beállítja a sejt háttérképét. Az URL helyett a háttérkép címét meg kell írni.
3. BGColor \u003d "Color" tulajdonság - Beállítja a sejtek színét.
4. BorderColor \u003d "Color" tulajdonság - Beállítja a sejtkeret színét.
5. Char \u003d "Letter" tulajdonság - Beállítja azokat a levelet, ahonnan szükség van az igazításra. Az igazítás attribútumértéket karban kell telepíteni.
6. A COLSPAN \u003d "szám" tulajdonság - beállítja a kombinált vízszintes sejtek számát.
7. Magasság \u003d "Szám" tulajdonság - Beállítja az asztal magasságát: vagy pixelben vagy százalékban%.
8. Szélesség \u003d "Szám" tulajdonság - Beállítja az asztal szélességét: vagy pixelben vagy százalékban%.
9. A ROWSPAN \u003d "szám" tulajdonság - Beállítja a függőleges cellák számát.
top - Illessze a cella tartalmát a vonal felső szélén
közép-igazítás középen
alsó - illesztés az alsó szélen
alapvonal - kiindulási igazítás
1. megjegyzés.
A címkén
Ugyanezek a paraméterek állnak rendelkezésre, mint a
. Paraméterek egy címkéhez
hierarchikusan alkalmazzák az összeset
ezen belül
Hogyan készítsük el a sejtek határait az asztalnál nem ragasztott
Abban az esetben, használja Border (határ sejtek) és nulla francia a sejtek között, mégis ragasztó, és kiderül, mely egy két határral. Annak érdekében, hogy elkerülje, regisztrálnia kell a Stílusok táblázatban Border-Collapse: Collapse:
...
Kedves olvasó, most már sokkal többet tanultál a HTML asztali címkéről. Most azt tanácsolom, hogy menjen a következő leckére.
A CSS lehetővé teszi, hogy nem csak az asztal határának stílusát telepítse, hanem az egyes sejtek határainak stílusát is. Mivel minden cella határai, majd a szomszédos sejtek között van, a határ kettős. De lehetőség van a szomszédos sejtek határainak összeillesztésére. Ehhez van egy határcsökkentő tulajdonság. Értékek:
border-Collapse: Különálló - Minden cellának saját határa van (alapértelmezett)
border-Collapse: Összecsukás - Összes határ
border Collapse: öröklítés - Az érték a szülőelemből származik
Hozzon létre egy táblázatot, és állítsa be az összes táblázat celláit, amely az oldalon lesz. Először nem fogunk megváltoztatni semmit, hogy lássuk, hogy az asztal hogyan fog kinézni: