Diskon! Diskon! Masukkan kupon "skillbaru" saat checkout di kelas apa saja

Logo Koala Skodev mengetik

Skodev

Belajar coding dalam bahasa Indonesia

CARA MENAMBAHKAN BACKGROUND DI HTML

Panduan langkah-langkah sederhana dan mudah dipahami tentang cara menambahkan background di HTML.

Daftar Isi:

Langkah 1: Membuat Dokumen HTM...
Langkah 2: Menambahkan CSS
Langkah 3: Menambahkan Gambar ...

HTML (HyperText Markup Language) adalah bahasa pemrograman yang digunakan untuk membuat dan mendesain website. Salah satu aspek penting dalam mendesain website adalah bagaimana cara memilih dan menambahkan background atau latar belakang halaman website. Berikut adalah panduan cara menambahkan background di HTML.

Langkah 1: Membuat Dokumen HTML

Sebelum menambahkan background, yang pertama harus kamu lakukan adalah membuat dokumen HTML. Buatlah dokumen baru dengan ekstensi .html (misal, index.html). Kemudian buatlah struktur dasar dokumen HTML seperti berikut:

<!DOCTYPE html>
<html>
 <head>
  <title>Halaman Web</title>
 </head>
 <body>
  
 </body>
</html>

Langkah 2: Menambahkan CSS

Cara paling umum untuk menambahkan background di HTML adalah dengan menggunakan CSS (Cascading Style Sheets). CSS memungkinkan kamu untuk mengatur gaya dan tampilan halaman web. Kamu bisa memasukkan kode CSS ke dalam dokumen HTML dengan dua cara.

Cara 1: Inline CSS

Cara ini berarti bahwa kita menambahkan CSS langsung ke tag HTML. Contohnya adalah sebagai berikut:

<body style="background-color:blue;">

Cara 2: Internal CSS

Dalam cara ini, CSS ditulis di dalam tag <style> di bagian <head> dari dokumen HTML. Contohnya adalah sebagai berikut:

<head>
 <style>
  body {
   background-color: blue;
  }
 </style>
</head>

Langkah 3: Menambahkan Gambar Sebagai Background

Selain warna, kamu juga bisa menambahkan gambar sebagai latar belakang halaman web dengan menggunakan properti background-image di CSS. Berikut adalah contoh cara menambahkan gambar sebagai background:

<head>
 <style>
  body {
   background-image: url("gambar.jpg");
  }
 </style>
</head>

Kamu hanya perlu mengganti “gambar.jpg” dengan alamat gambar yang ingin kamu gunakan.

Itulah panduan sederhana cara menambahkan background di HTML. Dengan menguasai cara ini, kamu bisa menambahkan nuansa kreatif pada desain website kamu.


Daftar newsletter skodev masukkan emailmu untuk dapat informasi menarik dari dunia koding