Spraw, aby stopka HTML pozostała na dole strony o minimalnej wysokości, ale nie nakładaj strony strony w CSS

Spraw, aby stopka HTML pozostała na dole strony o minimalnej wysokości, ale nie nakładaj strony strony w CSS
HTML pozwala twórcom stron internetowych dodać różne komponenty do tworzenia strony internetowej. Zwykle strony internetowe są podzielone na trzy części: nagłówek, nadwozie i stopkę. „„„Element zwykle zawiera treści wprowadzające””To ostatnia sekcja strony internetowej zawierająca dane witryny lub dane użytkownika oraz„ ”„Zawiera główną zawartość strony internetowej.

Ten zapis zostanie zbadany:

  • Jak zrobić stopkę?
  • Jak sprawić, by stopka HTML pozostała na dole strony?

Jak zrobić stopkę?

Aby utworzyć stopkę, użytkownicy mogą albo użyć prostego ””Element lub„”Tag.

Aby uzyskać lepszą koncepcję, przejdź przez dostarczoną procedurę.

Krok 1: Wstaw nagłówek

Najpierw wstaw nagłówek, używając dowolnego znacznika nagłówka z „

" Do "
". Na przykład użyliśmy „

”Tag, aby dodać nagłówek poziomu pierwszego poziomu.

Krok 2: Utwórz pojemnik „Div”

Następnie utwórz pojemnik „div” za pomocą „”Tag. Dodaj także atrybut „klasy” i przypisz go nazwa „główna zawartość".

Krok 3: Utwórz kolejny pojemnik „Div”

Teraz zrób następny „div”Kontener i określ”ciało”Jak„ „ID" wartość atrybutu.

Krok 4: Utwórz tabelę

Użyj „

„Tag, aby zrobić tabelę w drugim pojemniku. Następnie dodaj następujące elementy pomiędzy „
”Tag:

  • "
”Element wykorzystywany do definiowania wierszy w tabeli.
  • "
  • ”Służy do dodania nagłówka stołu.
  • "
  • ”Definiuje komórkę danych w tabeli, aby wstawić dane.

    Krok 5: Utwórz stopkę

    Następnie stwórz stopkę, wkładając inny „div”Pojemnik i przypisz go klasę„stopka”:

    Stopień strony pozostań na dole










    Tematy informatyki
    System operacyjny
    DBMS
    Sieć komputerowa
    Zarządzanie projektem


    stopka

    Alternatywnie użytkownik może korzystać z HTML ”„Element do dodania stopki na stronie HTML:

    stopka

    Wyjście

    Jak sprawić, by stopka HTML pozostała na dole strony?

    Aby stopień strony HTML pozostał na dole strony, wypróbuj poniżej podane instrukcje.

    Krok 1: Pierwszy pojemnik „Div” stylowy

    Uzyskaj dostęp do głównego „div”Pojemnik przy użyciu klasy„.główna zawartość”I zastosuj poniżej listy właściwości CSS:

    .główna zawartość
    Pozycja: względny;
    Min-Eight: 80%;
    kolor tła: bisque;
    Text-Align: Center;

    Tutaj:

    • "pozycja„Własność, którą element jest ustawiony w stosunku do jego normalnej pozycji.
    • "Min-Height”Służy do zdefiniowania minimalnej wysokości elementu.
    • "kolor tła”Określa określony kolor na tylnym elemencie.
    • "tekst-align„Własność jest wykorzystywana do ustawiania wyrównania tekstu.

    Wyjście

    Krok 2: Stylowy pojemnik „Div”

    Teraz uzyskaj dostęp do drugiego elementu „Div” za pomocą „ID" atrybut "#ciało". Następnie zastosuj następujące właściwości CSS:

    #ciało
    Wyściółka: 30px;
    Wyściółka: 60px;
    Margines: 10px 80px;

    Opis powyższego kodu podano poniżej:

    • "wyściółka”Jest wykorzystywany do przydzielania przestrzeni wokół zawartości elementu.
    • "Wyściółka”Służy do dodania dolnej przestrzeni wewnątrz elementu.
    • "margines”Określa przestrzeń poza elementem.

    Wyjście

    Krok 3: Style stopka

    Jeśli wykorzystałeś „”Tag, a następnie można uzyskać do niego dostęp za pomocą nazwy znacznika. W tym scenariuszu uzyskaliśmy dostęp do „div„Pojemnik z klasą”.stopka”:

    .stopka
    Pozycja: absolutna;
    Dół: 0;
    Wyściółka: 10px;
    Text-Align: Center;
    szerokość: 100%;
    Wysokość: 80px;
    Tło: RGB (134, 240, 139);

    Po uzyskaniu dostępu do kontenera „Div” zastosuj następujące właściwości CSS:

    • Tutaj, "pozycja„Właściwość służy do ustawienia pozycji elementu. Stopka zostanie ustawiona na dole strony, ustawiając wartość jako „absolutny".
    • „„spód”Służy do ustawienia pozycji pionowej pozycjonowanego elementu. Ta właściwość nie wpływa na elementy nieopisane.
    • "Wyściółka”Służy do dodawania przestrzeni wewnątrz elementu tylko w górnej stronie.
    • "szerokość”Definiuje szerokość elementu.
    • "wysokość”Definiuje wysokość elementu.
    • "tło”Służy do ustawienia koloru tła elementu.

    Można zauważyć, że stopka strony jest ustawiona na dole strony:

    Nauczyłeś się o tym, aby stopień strony pozostał na dole strony o minimalnej wysokości.

    Wniosek

    Aby stopień HTML pozostał na dole strony o minimalnej wysokości, najpierw utwórz stopkę za pomocą „”Tag lub„„Element w HTML. Następnie dostęp do stopki w CSS według nazwy znacznika lub przypisanej klasy lub identyfikatora. Następnie zastosuj „Pozycja: absolutna„Nieruchomość, aby stopień pozostał na dole strony. Ten post wyjaśnił metodę sprawiania, że ​​stopka HTML pozostała na dole strony.