Aby ustawić obraz za elementem, „zdjęcie w tle„Wystąpi własność CSS. Domyślnie pojawia się w lewym górnym rogu ekranu i jest powtarzany poziomo i pionowo. Możesz także dodać więcej niż jeden obraz w tle elementu HTML; Ponadto ustaw szerokość i wysokość obrazu zgodnie z preferencjami. Jednak możesz również zatrzymać powtarzanie obrazu.
Ten zapis zapewni następujące wyniki uczenia się:
Właściwość CSS „Image w tle”
„„zdjęcie w tle„Właściwość służy do zastosowania obrazu na tle określonego znacznika.
Składnia
Oto składnia, aby ustawić obraz tła na element HTML:
Image tła: obraz URL ();
Tutaj Image url () ma ścieżkę nazwy obrazu lub folderu obrazu, w której istnieje.
Spróbujmy przykładu, aby lepiej zrozumieć.
Przykład: Jak ustawić obraz tła za pomocą CSS?
W tym przykładzie najpierw utworzymy dwa kolejne elementy (
tagi), za którym zostanie dodany obraz tła. Możesz dodać elementy zgodnie z wyborem i zastosować do niego właściwość obrazu tła:
Ustaw obraz tła
Aby ustawić obraz tła, użyj właściwości obrazu tła CSS
Możesz dodać elementy zgodnie z wyborem i zastosować do niego właściwość tła.
Przejdź do CSS i przypisz nazwę obrazu w „zdjęcie w tle„URL:
ciało
Image tła: URL („IMG.jpg ");
Po zakończeniu wszystkich kroków wykonaj plik HTML, otrzymasz następujący wynik:
Tutaj widać, że obraz tła jest powtarzany. Aby tego uniknąć, użyj „powtarzanie tła”Właściwość i ustaw wartość na„bez powtórki”:
ciało
Image tła: URL („IMG.jpg ");
Powtórzenie tła: bez powtórzenia;
Po zakończeniu wykonaj kod i sprawdź swoją stronę internetową:
Teraz masz czysty i elegancki wygląd obrazu tła na tag.
Dobre praktyki do ustawiania obrazów w tle
Wniosek
Aby dodać obraz tła w CSS, użyj „zdjęcie w tle”Właściwość i podaj adres URL obrazu w funkcji URL () CSS. Możesz także zapobiec powtarzaniu się obrazu za pomocą „powtarzanie tła”Własność i ustalenie wartości do„nic". W tym artykule wyjaśniono procedurę dodania obrazu do tła za pomocą „zdjęcie w tle" I "powtarzanie tła" nieruchomości.