Bagaimana cara menambahkan warna latar belakang dalam HTML?

Cara Mudah Mengubah Warna Background Website – Untuk kamu yang baru saja belajar membuat website, tentunya kamu akan mempelajari HTML dan juga CSS jika benar-benar ingin mahir mengenal dasarnya. Akan berbeda rasanya jika kamu langsung belajar Framework CSS yang tidak begitu mengharuskan kamu benar-benar paham dengan HTML + CSS misalnya seperti Bootstrap.

Table of Contents Show

Cari file CSS-nya terlebih dahulu
Ubah Warna Background-nya
Bagaimana cara menambah warna latar belakang dalam HTML?
Apa HTML yang benar untuk menyisipkan gambar latar belakang?
Perintah apa yang diberikan untuk menambahkan background warna?
Bagaimanakah cara mengubah warna background sebuah section pada website?

Untuk membuat sebuah website saja bahkan kamu hanya tinggal memanggil nama class saja dan hasilnya sudah cukup rapi tanpa perlu mengetikkan koding CSS manual.

Nah, untuk kamu yang benar-benar awam, tentunya ada beberapa hal yang sering membuatmu kebingungan saat mengubah suatu desain pada CSS. Sebagai contoh, misalnya kamu men-download template dari internet karena ingin melihat bentuk kodingnya seperti apa. Setelah itu, biasanya kamu akan penasaran dengan mencoba mengubah isi template mulai dari warna, gambar, tulisan dan lain-lain.

Namun, kemungkinan kamu akan merasa sulit untuk mengubahnya karena masih pemula dan belum banyak paham mengenai kodingnya. Sebagai contoh kamu tidak bisa mengubah warna background website di template tersebut.

Nah, DUMET School akan memberikan sedikit tips untuk mengubah warna background website dengan CSS.

Cari file CSS-nya terlebih dahulu

Kalau kamu men-download template, cari folder bernama css atau assets.
Cari file CSS yang biasanya bernama style/styles/main dan berekstensi .css
Buka file-nya.

Ubah Warna Background-nya

Cari tulisan “body” yang biasanya ada di baris teratas.
Cari tulisan “background” atau “background-color“.
Ubah dengan kode warna di bagian setelah tanda hashtag.

Biasanya kode awalnya akan seperti berikut ini:

body{
background: #2ecc71;
font-family: arial;
color:#2c3e50;
}

Tips Mencari Kode Warna

Karena CSS menggunakan kode hexa sebagai sebutan warna, kamu bisa mencari listnya dengan mengetikkan “color hex code” di Google.

Perhatikan kode di bawah ini. Yang berbeda adalah kode yang ada di dalam background.

body{
background: #746ab0;
font-family: arial;
color:#2c3e50;
}

Setelah diubah, warna background di website akan berubah menjadi seperti berikut ini:

Bagaimana? Mudah bukan? Semoga artikel ini bermanfaat ya! Jika kamu mau paham lebih banyak dan detail tentang pembuatan website, kamu bisa pelajari dengan mangambil paket kursus website di DUMET School.

Contoh:

<!DOCTYPE HTML>

<html>

<head>

<title>Cara mengatur warna Latar Belakang atau background HTML5| emerer.com</title>

</head>

<h2>Warna latar belakang dengan perintah:</h2>

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

Dapat juga menggunakan kode warna hexadesimal: <br>

body style="background-color:#DEB887"<br><br>

Dapat juga menggunakan kode warna RGB:<br>

body style="background-color:rgb(255,0,255)"

</body>

</html>

Muhammat Rasid Ridho

[telp/wa 0831 8393 2425] Software Developer yang Suka Jalan jalan, Belajar Jaringan dan Berbagi Cerita. Jangan lupa tulis komentar di bawah ini ya teman teman ... !

Bagaimana cara menambah warna latar belakang dalam HTML?

Untuk mengatur warna latar belakang dalam HTML, gunakan atribut style. Atribut style menentukan gaya sebaris untuk sebuah elemen. Atribut ini digunakan dengan tag HTML <body>, dengan properti CSS background-color.

Apa HTML yang benar untuk menyisipkan gambar latar belakang?

Tikkan <div style="background-image: url('[image url]');"> di baris berikutnya. Inilah label HTML untuk menambahkan gambar latar belakang pada halaman web. Ganti "[image url]" dengan lokasi URL asli dari gambar yang diinginkan.

Perintah apa yang diberikan untuk menambahkan background warna?

Perintah BODY adalah perintah untuk membuat warna latar belakang pada layar, mengubah warna link, mengubah warna dasar link, menampilkan pesan ketika halaman ditutup, dan lain-lain sesuai dengan atribut yang diberikan.