Stół środkowy CSS
Przykład 01: Tworzenie tabeli na środku strony internetowej za pomocą CSS znacznika stylu w pliku HTML
W tym przypadku będziemy tworzyć tabelę, która zostanie wyrównana do centrum strony internetowej. Metoda CSS w stylu zostanie wykorzystana w tym przypadku. W tym przykładzie zostanie użyta właściwość marginesu do centralnego wyrównania tabeli w naszej przeglądarce.
W tym skrypcie najpierw otworzymy znacznik głowy. W znaczniku głównym otworzymy tag w stylu CSS. W stylu podarujemy tabelę i jego elementy niektóre właściwości stylizacji. Pierwszy będzie rozmiar granicy, forma i kolor; Następnie damy mu trochę wyściółki. Na końcu znacznika stylu przypisamy właściwość „Margin”, a następnie zamkniemy styl i znacznik głowy. Następnie będziemy otwierać znacznik ciała, w którym utworzymy naszą tabelę za pomocą znacznika tabeli. Wewnątrz znacznika stołowego damy mu dwa zestawy wierszy. W pierwszym rzędzie zostanie użyty znacznik „Th”, który przypisuje nagłówek kolumny tabeli. Następnie utworzymy drugi wiersz za pomocą znacznika „TR” i podamy ten wiersz kilka danych dla kolumn za pomocą znacznika „TD”.
Jak widać na powyższym wyjściu, tabela jest wyrównana do środka strony ze względu na właściwość automatycznego marginesu, która została przypisana w nagłówka.
Przykład 02: Zastosowanie techniki CSS w linii do wyrównania tabeli pośrodku strony HTML
W tym przykładzie będziemy używać właściwości marginesu z funkcją automatyczną, która wyrównuje tabelę do środka strony internetowej. W tym przykładzie zostanie zastosowane podejście wbudowane CSS, aby osiągnąć cel.
W tym skrypcie zaczniemy bezpośrednio od znacznika ciała. Zaczniemy od znacznika H1, aby nadać stronie nagłówka. Następnie rozpoczniemy znacznik tabeli, w którym połączymy styl i nadamy mu granicę z formą, rozmiarem i kolorem jako właściwość. Następnie podamy tabelę trochę wyściółki, a właściwość marginesu z funkcją automatyczną zostanie wywołana. Tag „TR” zostanie następnie użyty do dodania dwóch wierszy do tabeli. Użyjemy znacznika „Th”, aby podać kolumnę nazw tabel i znacznik „TD” do przypisania danych do drugiego wiersza tabeli. Słowo kluczowe w stylu CSS zostanie zastosowane zarówno do tagów „TH”, jak i „TD”, aby zapewnić cechy stylistyczne dla komponentów tabeli niezależnie. Właściwości stylizacji obejmują obramowanie z formą, rozmiarem, kolorem i wyściółką.
Po zapisaniu poprzedniego skryptu i otwarciu go na dowolnej wybranej przeglądarce, otrzymamy wyjście kosztów ogólnych. Jak widzimy, z powodzeniem wyrównaliśmy tabelę ze środkiem strony za pomocą podejścia wbudowanego CSS.
Przykład 03: Korzystanie z właściwości CSS-lewej marginesu i marginesu do wyrównania tabeli do środka strony w pliku HTML
W tym przykładzie zostanie zastosowane podejście CSS styl. Tutaj utworzymy tabelę, która zostanie wyśrodkowana na stronie. Własność marginesu zostanie podzielona na dwa kawałki, po lewej i prawej stronie, które następnie zostaną wykorzystane do centralnego wyrównania tabeli na stronie naszej przeglądarki w tym przykładzie.
Znacznik zostanie otwarty najpierw w tym skrypcie. Tag w stylu CSS zostanie otwarty w znaczniku głowy. Podamy tabelę i jego części niektóre cechy stylistyczne z tagiem stylu. Najwyższy rozmiar granicy, kształt i kolor, a następnie wyściółka. Po znaczniku stylu przypisamy właściwości „marginesowe” i „margines-lewi” i podamy im wartości procentowe przed zamknięciem stylu i tagów głowy. Następnie otworzymy znacznik ciała i zaczniemy od podania strony nagłówka za pomocą znacznika H1. Tabela zostanie następnie użyta do skonstruowania naszej tabeli. Damy mu dwa zestawy wierszy w znaczniku tabeli.
Znacznik „th” zostanie użyty w pierwszym rzędzie, aby przypisać nagłówek kolumny tabeli. Następnie, używając znacznika „TR”, utworzymy drugi wiersz i użyjemy znacznika „TD”, aby wypełnić kolumny danymi. Następnie zamkniemy wszystkie tagi i zapiszemy plik, aby zachować modyfikacje, które zostaną wyświetlone w naszej przeglądarce, jak pokazano poniżej:
Tabela jest wyrównana do środka strony, jak pokazano na powyższym wyjściu, z powodu właściwości marginesowych i prawych ustawionych w nagłówku pliku.
Przykład 04: Za pomocą właściwości CSS z marginesem i prawej margines
W tym przykładzie zostanie zastosowane podejście CSS styl. Tutaj stworzymy tabelę, która istnieje na środku strony. Właściwość marginesu zostanie podzielona na dwie sekcje, po lewej i prawej stronie, które następnie zostaną użyte do centralnego wyrównania tabeli w naszym przykładzie za pomocą funkcji automatycznej na stronie naszej przeglądarki.
W tym skrypcie znacznik głowy zostanie otwarty najpierw. W znaczniku głównym tag stylu CSS zostanie otwarty. Z tagiem stylu damy tabelę i jego komponenty niektóre cechy stylistyczne. Wyściółka nastąpi po wielkości granicy, kształcie i kolorze. Przed zamknięciem stylu i tagów na głowie dodamy właściwości „margines-prawy” i „margines-lewą” po znaczniku stylu i nadajmy im funkcję automatyczną jako swoją wartość. Znacznik tabeli zostanie wykorzystany do budowy naszej tabeli.
W obrębie znacznika tabeli damy mu dwa zestawy wierszy. Znacznik „th” zostanie użyty w pierwszym rzędzie, aby podać kolumnę na kierunku stolika. Następnie, używając znacznika „TR”, skonstruujemy drugi wiersz, a znacznik „TD” zostanie użyty do wypełnienia kolumn danymi. Następnie zamkniemy wszystkie tagi i zapiszemy plik, aby zachować zmiany, które będą widoczne w naszej przeglądarce.
Ponieważ marginesowe wartości i prawicowe wartości w nagłówku pliku są ustawione na automatyczne, tabela jest wyrównana do środka strony, jak pokazano na powyższym wyjściu.
Wniosek
Omówiliśmy wiele metod, które CSS zapewnia, aby wyrównać tabelę na środku strony internetowej w tym artykule. Własność marginesu została zbadana i wdrożona w języku znaczników hipertekstu, aby wykonać to zjawisko. Użyliśmy właściwości marginesu o kilku różnych przypisanych właściwościach, takich jak funkcja automatyczna i wartości procentowe, aby wyrównać tabelę w środku. W tym artykule zaimplementowaliśmy wszystkie przykłady notatnika ++.