ubah background css

Cara Ubah Background Website Dengan CSS, Lengkap !!

Taufiksi – Jadi, kamu tidak tau caranya untuk ubah background website dengan menggunakan CSS, tenang mungkin di artikel ini kamu menemukan solusinya.

Saya pikir itu adalah hal yang sangat mudah, tapi mungkin juga bisa menjadi lupa caranya kalau tidak sering ngoding.

Yahh, saya juga masih sering googling, kalau sedang tidak ingat caranya ubah background wkwk, bukan robot cuy.

Jadi dari pada saya ribet ribet berselancar di mbah google maka saya putuskan untuk membuat artikelnya sendiri.

Emang sih membuat website terkadang juga bisa di sebut dengan seni. Maka dari itu berbanggalah kalau kamu seorang developer ataupun programmer. Kamu layak untuk di sebut dengan seniman wkwk.

Mulai Online-kan Projectmu

Udah ngodingnya capek, tapi masih di localhost ? tenang, yang kamu perlukan hanya uploud project ke hosting agar bisa diakses orang lain. Beli hosting sekarang dan dapatkan domain gratis.

Beli Hosting

Ini serius, kamu adalah seorang seniman karena perlu imajinasi juga, ya untuk beberapa kasus sih wkwk. Seperti kalau kamu menjadi front end developer maka kamu bisa melukis dengan menggunakan CSS dan lain sebagainya.

Ahh baiklah daripada makin ngelantur, kamu juga pasti sangat membutuhkan caranya lebih cepat kan. Emang kebiasaan sih wkwk.

Apa Itu Background ?

Tapi sebelum kamu tau codingannya, mungkin saya ingin bercerita sedikit tentang pembahasan kali ini, karena tidak mudah untuk membuat artikel ini mengalahkan website yang sudah besar besar wkwk.

Yahh bisa di bilang kayak petani kode dan lain lain lah apa lagi kalau dari dicoding bahkan codepolitan membuat artikel kayak gini sudah pasti akan terasa berat.

Jadi background atau yang biasanya di kenal dengan latar belakang adalah suatu element yang bisa di bilang wajib sih.

Dengan mengubah warna background maka akan membuat website yang kamu miliki setidaknya menjadi menarik perhatian pengunjung.

Ada beberapa cara untuk mengubah dan memodifikasi background website yaitu dengan menggunakan warna ataupun dengan menggunakan gambar.

Yang nantinya kita akan menggunakan CSS untuk ubah background dari website yang sedang kamu build dengan sangat baik.

Ubah Background Warna Website Dengan CSS

Yang pertama kita akan mencoba ubah background warna website. Di sini kita akan menggunakan metode penulisan css external aja kali ya.

Okelah misalkan kamu punya kode html seperti d bawah ini, coba perhatikan dulu.

<!DOCTYPE html>
<html lang="en">
<head>
    <link rel="stylesheet" href="style.css">
    <title>Link HTML</title>
</head>
<body>
    <p>
        Mengubah warna background website
    </p>
</body>
</html>

Oke, jadi bagaimana caranya kamu mengubah warna background dari kode diatas ? Simple aja kamu bisa membuat file baru yang berisi dengan kode CSS dan di beri nama style.css.

Kemudian kamu bisa isi file tersebut dengan code berikut ini.

body {
  background : red;
  color : white;
}

Sangat simpel kan kalau kamu ingin mengubah warna background website dengan css. Emang cuma kayak gitu doang sih.

Ubah Background Gambar Website Dengan CSS

Kemudian yang perlu kita bahas lagi adalah caranya mengubah background gambar dengan menggunakan css.

Kita akan memakai kode yang ada di atas karena males bikin kode baru wkwk. Gapapa kan ya sama aja sih yang di pakai kode htmlnya ja.

Kemudian yang di ubah cuma di bagian CSS aja dengan codingan di bawah ini.

body{
  background: url('background.png');
  color: #fff;
}

Giamana mudah kan ? jadi di dalam url itu adalah tempat dimana kamu menyimpan gambar, atau bahkan kamu bisa mengambil gambar dari internet tinggal copas aja urlnya.

Penutup

Baiklah baiklah, mungkin itu dulu artikel caranya mengubah background pada website dengan menggunakan css.

Sampai jumpa di lain artikel babauy.




Terima kasih sudah membaca artikelnya, tetap semangat jalani harimu meskipun dunia bertolak belakang dengan keinginanmu. Dan jangan lupa ngopi supaya sadar pahitnya dunia tidak semanis mimpi. Ahay

Tertanda Sayang


Taufik Nurhidayah
Traktir Kopi

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan.