HTML - tła

Domyślnie tło Twojej strony internetowej jest w kolorze białym. Może ci się to nie podobać, ale nie martw się. HTML zapewnia dwa dobre sposoby dekorowania tła strony internetowej.

Tło HTML z kolorami
Tło HTML z obrazami

Przyjrzyjmy się teraz każdemu podejściu, używając odpowiednich przykładów.

Tło HTML z kolorami

Plik bgcolor Atrybut jest używany do kontrolowania tła elementu HTML, w szczególności treści strony i tła tabeli.

Note- Atrybut bgcolor jest przestarzały w HTML5. Nie używaj tego atrybutu.

Poniżej znajduje się składnia użycia atrybutu bgcolor z dowolnym znacznikiem HTML.

<tagname bgcolor = "color_value"...>

Tę wartość_koloru można podać w dowolnym z następujących formatów -

<!-- Format 1 - Use color name -->
<table bgcolor = "lime" >
 
<!-- Format 2 - Use hex value -->
<table bgcolor = "#f1f1f1" >
 
<!-- Format 3 - Use color value in RGB terms -->
<table bgcolor = "rgb(0,0,120)" >

Przykład

Oto przykłady ustawiania tła tagu HTML -

<!DOCTYPE html>
<html>

   <head>
      <title>HTML Background Colors</title>
   </head>
	
   <body>
      <!-- Format 1 - Use color name -->
      <table bgcolor = "yellow" width = "100%">
         <tr>
            <td>
               This background is yellow
            </td>
         </tr>
      </table>
 
      <!-- Format 2 - Use hex value -->
      <table bgcolor = "#6666FF" width = "100%">
         <tr>
            <td>
               This background is sky blue
            </td>
         </tr>
      </table>
 
      <!-- Format 3 - Use color value in RGB terms -->
      <table bgcolor = "rgb(255,0,255)" width = "100%">
         <tr>
            <td>
               This background is green
            </td>
         </tr>
      </table>
   </body>
   
</html>

To da następujący wynik -

Tło HTML z obrazami

Plik backgroundatrybut może być również używany do kontrolowania tła elementu HTML, w szczególności treści strony i tła tabeli. Możesz określić obraz, aby ustawić tło strony HTML lub tabeli.

Note- atrybut background jest przestarzały w HTML5. Nie używaj tego atrybutu.

Poniżej znajduje się składnia użycia atrybutu tła z dowolnym znacznikiem HTML.

Note- Atrybut background jest przestarzały i zaleca się używanie arkusza stylów do ustawiania tła.

<tagname background = "Image URL"...>

Najczęściej używanymi formatami obrazów są obrazy JPEG, GIF i PNG.

Przykład

Oto przykłady ustawiania obrazów tła tabeli.

<!DOCTYPE html>
<html>

   <head>
      <title>HTML Background Images</title>
   </head>
	
   <body>
      <!-- Set table background -->
      <table background = "/images/html.gif" width = "100%" height = "100">
         <tr><td>
            This background is filled up with HTML image.
         </td></tr>
      </table>
   </body>
   
</html>

To da następujący wynik -

Wzorzyste i przezroczyste tła

Być może widziałeś wiele wzorów lub przezroczystych tł na różnych stronach internetowych. Można to łatwo osiągnąć, używając w tle wzorzystego lub przezroczystego obrazu.

Zaleca się, aby podczas tworzenia wzorów lub przezroczystych obrazów GIF lub PNG używać możliwie najmniejszych wymiarów, nawet tak małych jak 1 x 1, aby uniknąć powolnego ładowania.

Przykład

Oto przykłady ustawiania wzoru tła tabeli -

<!DOCTYPE html>
<html>

   <head>
      <title>HTML Background Images</title>
   </head>
	
   <body>
      <!-- Set a table background using pattern -->
      <table background = "/images/pattern1.gif" width = "100%" height = "100">
         <tr>
            <td>
               This background is filled up with a pattern image.
            </td>
         </tr>
      </table>

      <!-- Another example on table background using pattern -->
      <table background = "/images/pattern2.gif" width = "100%" height = "100">
         <tr>
            <td>
               This background is filled up with a pattern image.
            </td>
         </tr>
      </table>
   </body>
   
</html>

To da następujący wynik -