Pastinya teman-teman pernah melihat sebuah website mempunyai sebuah tampilan yang menarik dari warna yang bercorak-corak seperti warana gradient, bahkan juga bisa berupa gambar, Jika teman-teman ketahui background jika tidak kita style warna defaultnya adalah warna putih ya teman-teman, sungguh tidak menarik bukan, maka dari itu disini kita akan sama-sama mencoba belajar cara merubah background di sebuah website, maka dari itu jangan kemana-mana ya teman-teman simak terus ya.
Untuk belajar cara merubah background di sebuah website, teman-teman disini apakah sudah bisa mengetahui akan pakai apakah saya merubahnya, ya benar sekali kita akan membutuhkan property background, tapi saya pernah melihat ada yang menggunakan property tapi backgroundnya itu ada yang image dan color mas, apa bedannya ? tentu beda ya teman-teman di lihat dari propertynya pasti teman-teman sudah tau kok, property background-color, hanya bisa diisi dengan warna sedangkan property background-image, hanya bisa diisi dengan gambar, dan jika kita menggunakan background teman-teman bisa mengisinya dengan gambar maupun warna ya teman-teman, lebih fleksibel bukan.
Lalu nanti kita disini menggunakan apa mas, kita gunakan background saja ya teman-teman, lebih singkat, dan property ini bisa menggunakan warna maupun gambar. Oiya hampir lupa, porperty background ini tidak hanya bisa merubah warna background atau latar belakang website ya teman-teman, tapi bisa juga kita gunakan di konten-konten lain, seperti background menu, artikel, dan lain-lain, oke langsung saja bagaimana saya membuatanya, perhatikan strukutur HTML CSS berikut ini:
<!DOCTYPE html>
<html>
<head>
<title>cara merubah background di sebuah website</title>
</head>
<-e-style-e- type="text/css">
*{
padding: 0;
margin: 0;
}
body{
background: url("../htm5.jpg");
}
.container{
padding: 50px;
width: 800px;
margin: auto;
background: magenta;
}
h1{
background: green;
}
h3{
background: blue;
}
p{
background: yellow;
}
<-e-/style>
<body>
<div class="container">
<h1>Ini Judul saya berikan background warna hijau</h1>
<h3>disini saya membuat sebuah container ya teman-teman, dimana saya memberi background juga dengan warna</h3>
<h3>jika body saya memberinya dengan gambar ya, supaya teman-teman tau perbedaanya</h3>
<p>jika ini adalah sebuah paragraph saya berikan warna kuning</p>
</div>
</body>
</html>
nb: tolong hapus -e-, karena jika saya menulis langsung style kode css akan acak-acakan, oke bagaimana hasilnya, maka hasilnya seperti ini:
Bagaimana teman-teman sangat menarik bukan, oke sampai disini dulu belajar kita tentang cara merubah background di sebuah website, semoga bermanfaat sampai jumpa pada artikel selanjutnya terimakasih.