Najlepszy samouczek Tła CSS (w tle) W 2024 r. W tym samouczku możesz dowiedzieć się Kolor tła,Przykłady,Przykłady,Tło obrazu,Przykłady,Przykłady,Obrazy tła - Dachówka pozioma lub pionowa,Przykłady,Przykłady,Tło obrazu - Ustaw pozycję i nie płytka,Przykłady,Przykłady,Tło - skróconą własnością,Przykłady,Więcej przykładów,Właściwości tła CSS,
Właściwości CSS tła są używane do definiowania tła elementów HTML.
Właściwości CSS zdefiniować efekty w tle:
Właściwość background-color określa kolor tła elementu.
Kolor tła strony, aby korzystać w selektorze ciała:
CSS wartości kolorów jest zwykle definiowane w następujący sposób:
Poniżej przykład, h1, P i elementy div mają różne kolory tła:
atrybutu background-image opisuje elementy tła.
Domyślnie obraz tła kafelki wielokrotnie wyświetlany na pokrycie całego podmiotu elementu.
Przykłady strona ustawienie tła:
Oto przykład złej kombinacji tekstu i tła. Tekst słabą czytelność:
Domyślnie właściwość background-image kafelki w orientacji poziomej lub pionowej strony.
Jeśli niektóre obrazy sąsiadująco w pionie i poziomie, więc wygląda to bardzo skoordynowane, co następuje:
Jeśli obraz płytki (repeat-x) tylko w kierunku poziomym, strona tło będzie lepiej:
Niech obraz tła nie wpływa na układ tekstu
Jeśli nie chcesz, aby płytki obrazu, można użyć atrybutu background-repeat:
Powyższy przykład, obraz tła i tekst pojawia się w tym samym miejscu, tak aby układ strony bardziej uzasadnione, nie ma wpływu na czytanie tekstu, możemy zmienić położenie obrazu.
Właściwość background-position może być użyty do zmiany obrazu w tle tutaj:
W powyższym przykładzie widzimy kolor tła strony przez wiele atrybutów, które kontrolują.
Aby uprościć kod dla tych właściwości, możemy wykorzystać te atrybuty są połączone w tej samej nieruchomości.
Skrótowym kolor tła dla nieruchomości "w tle":
Przy użyciu właściwości skrótowej, kolejność atrybutów jako ::
Wszystkie te atrybuty nie trzeba używać, można korzystać w zależności od rzeczywistych potrzeb strony.
Ten przykład używa CSS opisano wcześniej, można zobaczyć przykład: Przykłady CSS
Jak ustawić stały obraz tła
Ten przykład pokazuje jak ustawić stały obraz tła. Obraz nie będzie przewijać się z resztą strony.
Property | 描述 |
---|---|
background | 简写属性,作用是将背景属性设置在一个声明中。 |
background-attachment | 背景图像是否固定或者随着页面的其余部分滚动。 |
background-color | 设置元素的背景颜色。 |
background-image | 把图像设置为背景。 |
background-position | 设置背景图像的起始位置。 |
background-repeat | 设置背景图像是否及如何重复。 |