HTML - Arka Planlar
Varsayılan olarak, web sayfanızın arka planı beyaz renktedir. Beğenmeyebilirsin ama endişelenme. HTML, web sayfanızın arka planını dekore etmenin iki iyi yolunu izlemenizi sağlar.
- Renklerle HTML Arka Planı
- Resimlerle HTML Arka Planı
Şimdi her iki yaklaşımı da uygun örneklerle tek tek görelim.
Renklerle HTML Arka Planı
bgcolor öznitelik, bir HTML öğesinin arka planını, özellikle sayfa gövdesini ve tablo arka planını kontrol etmek için kullanılır.
Note- bgcolor özelliği HTML5'te kullanımdan kaldırıldı. Bu özelliği kullanmayın.
Aşağıda, bgcolor niteliğini herhangi bir HTML etiketiyle kullanmak için sözdizimi verilmiştir.
<tagname bgcolor = "color_value"...>
Bu renk_değer aşağıdaki formatlardan herhangi birinde verilebilir -
<!-- 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)" >
Misal
İşte bir HTML etiketinin arka planını ayarlamak için örnekler -
<!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>
Bu, aşağıdaki sonucu verecektir -
Resimlerle HTML Arka Planı
backgroundöznitelik, bir HTML öğesinin arka planını, özellikle sayfa gövdesini ve tablo arka planını kontrol etmek için de kullanılabilir. HTML sayfanızın veya tablonuzun arka planını ayarlamak için bir resim belirtebilirsiniz.
Note- Arka plan özelliği HTML5'te kullanımdan kaldırıldı. Bu özelliği kullanmayın.
Herhangi bir HTML etiketiyle arka plan özniteliğini kullanmak için sözdizimi aşağıdadır.
Note- Arka plan özelliği kullanımdan kaldırılmıştır ve arka plan ayarı için Stil Sayfası kullanılması önerilir.
<tagname background = "Image URL"...>
En sık kullanılan resim formatları JPEG, GIF ve PNG resimleridir.
Misal
Bir tablonun arka plan resimlerini ayarlamak için örnekler.
<!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>
Bu, aşağıdaki sonucu verecektir -
Desenli ve Şeffaf Arka Planlar
Çeşitli web sitelerinde birçok desen veya şeffaf arka plan görmüş olabilirsiniz. Bu, arka planda desenli görüntü veya şeffaf görüntü kullanılarak kolayca elde edilebilir.
Yavaş yüklemeyi önlemek için desenler veya şeffaf GIF veya PNG görüntüleri oluştururken 1x1 kadar küçük bile mümkün olan en küçük boyutları kullanmanız önerilir.
Misal
İşte bir tablonun arka plan desenini ayarlamak için örnekler -
<!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>
Bu, aşağıdaki sonucu verecektir -