Tabela CSS (tabela)
Zastosowanie CSS może znacznie poprawić wygląd tabel HTML.
spółka | kontakt | kraj |
---|---|---|
Alfreds Futterkiste | Maria Anders | Niemcy |
Berglunds snabbkop | Christina Berglund | Szwecja |
Centro Comercial Montezumy | Francisco Chang | Meksyk |
Ernst Handel | Roland Mendel | Austria |
Wyspa Trading | Helen Bennett | UK |
Koniglich Essen | Philip Cramer | Niemcy |
Śmiejąc Bacchus Winecellars | Yoshi Tannamuri | Kanada |
Magazzini Alimentari Riuniti | Giovanni Rovelli | Włochy |
Północ / Południe | Simon Crowther | UK |
SPECIALITES Paryż | Marie Bertrand | Francja |
The Big Cheese | Liz Nixon | USA |
Vaffeljernet | Palle Ibsen | Dania |
Tabela Granicznej
Określa granice tabeli CSS, użyj właściwości obramowania.
Poniższy przykład określa tabelę Th oraz pierwiastków TD czarną obwódką:
Zauważ, że w powyższym przykładzie, tabela ma podwójne obramowanie. To dlatego, że tabela i th / td elementy mają oddzielne granice.
Aby wyświetlić pojedynczą klatkę z tabeli, należy użyć właściwości border-collapse.
Składana rama
atrybut border-collapse określić, czy granice tabeli są zwinięte w jednej granicy lub rozdzielone:
Szerokość stołu i wysokość
Szerokość i wysokość atrybuty określają szerokość i wysokość stołu.
Poniższy przykład jest ustawiona na 100% szerokości stołu wysokość 50 pikseli th element:
wyrównanie tekstu Formularz
Tabela wyrównanie tekstu i pionowe właściwości wyrównania.
Właściwość text-align jest ustawiony poziomo, jak wyrównanie lewej, prawej lub centrum:
Vertical-align własności pionowe wyrównanie ustawienia, takie jak góra, dół, lub w środku:
wypełnienie formularza
Jeżeli przestrzeń pomiędzy kontroli granicznej w spisie treści, należy użyć atrybutu wypełnienia i td elementy th:
tabela kolorów
Poniższy przykład określa kolor obramowania, i Th elementy tekstu i kolor tła:
Przykłady
{
border:1px solid green;
}
th
{
background-color:green;
color:white;
}
Spróbuj »
Więcej przykładów
Zrób formę spersonalizowaną
Ten przykład pokazuje, jak utworzyć formę spersonalizowaną.
Ustaw pozycję napisów stołowego
Ten przykład pokazuje jak ustawić nagłówek tabeli.