Belajar CSS Sesi 4: Mengubah Background Pada CSS

Belajar CSS Sesi 4: Mengubah Background Pada CSS – Semoga anda terbantu dengan isi dari Postingan ini. Sekarang kita lanjut ke tutorial yang ketiga yang membahas tentang “Mengubah Background Pada CSS“. Tanpa basa basi yuk di simak selengkapnya tentang Mengubah Background Pada CSS.

Mengubah Background

Background pada sebuah halaman website adalah salah satu bagian penting untuk kelangsungan sebuah halaman website supaya halaman website tersebut terlihat menarik dan modern karena adanya background atau latar belakang pada halaman website tersebut.
Ada beberapa cara untuk memperindah background pada halaman website anda, bisa anda gunakan gambar atau hanya warna background dengan bantuan CSS. Untuk mengubah background CSS menggunakan property background di dalam selector pada CSS. Selain menggunakan selector, bisa menggunakan nama html tag misalkan body pada website yang dapat digunakan untuk mengubah background dengan gambar maupun warna background yang menurut anda cocok pada website yang anda buat.

Bagaimana cara mengubah background pada CSS?

Pada tutorial kali ini sesuai dengan judul artikel ini bahwa kita akan belajar untuk mengubah background dengan bantuan CSS. Untuk memulainya anda harus membuat sebuah file yang berekstensi .html, lalu isi file html tersebut dengan syntax css dan juga html tag pada file tersebut.

Metode yang saya gunakan kali ini adalah menggunakan metode penulisan syntax Internal Style, bisa anda lihat syntaxnya dibawah ini:

<html>
<head>
    <style type="text/css">
    body{
    background: green;
    color: white;
    }
    </style>
        <title>Belajar CSS Sesi 4: Mengubah Background Pada CSS</title>
</head>
<body>
    <strong>Belajar CSS Sesi 4: Mengubah Background Pada CSS</strong>
</body>
</html>

Result Background Berwarna

Untuk mengubah background dengan gambar, anda bisa melihat syntax dan juga gambar dibawah ini:

<!DOCTYPE html>
<html>
<head>
    <style type="text/css">
    body{
    background: url("gambar.png") no-repeat;
    color: white;
    }
    </style>
        <title>Belajar CSS Sesi 4: Mengubah Background Pada CSS</title>
</head>
<body>
<br />
<br />
<br />
<br />
<br />
    <strong>Belajar CSS Sesi 4: Mengubah Background Pada CSS</strong>
</body>
</html>

Result Background Bergambar

Perhatikan value pada property background yaitu url(“gambar.jpg”);
url tersebut merupakan sebuah perintah/syntax untuk memanggil sebuah gambar dengan format file yang harus sama dengan format file yang ada. Kalau format filenya berbeda, maka tidak akan berhasil syntax tersebut, melainkan backgroundnya menjadi warna defaultnya yaitu putih.

Sekian artikel ini, semoga kedapannya setelah anda membaca artikel “Belajar CSS Sesi 4: Mengubah Background Pada CSS” dapat anda fahami dengan mudah artikel tersebut.

Tutorial CSS Dasar Lainnya:
Belajar CSS Sesi 1: Pengertian dan Fungsi CSS
Belajar CSS Sesi 2: Dasar Penulisan Syntax CSS
Belajar CSS Sesi 3: Mengatur Hyperlink Pada CSS
Belajar CSS Sesi 4: Mengubah Background Pada CSS

Shortcutid.com