Mengenal Fungsi CSS Paling Sederhana Untuk HTML

CSS adalah singkatan dari cascading style sheets (CSS) adalah suatu bahasa pemograman web dalam bentuk stylesheet yang digunakan untuk mengatur tampilan suatu dokumen yang ditulis dalam bahasa/kode markup. Penggunaan yang paling umum dari CSS adalah untuk memformat halaman web yang ditulis dengan HTML dan XHTML.

Nah pada artikel kali ini saya akan memperkenalkan fungsi dasar CSS dan penempatan code CSS yang benar pada blogger. CSS ini dapat anda gunakan untuk mengatur ukuran gambar, mengatur peletakan tulisan/gambar, namun secara garis besar fungsi CSS sebenarnya adalah untuk optimasi tampilan visual pada gambar atau teks.

Contoh penulisan kode CSS:

/* contoh */
.contoh {
    text-align:center;
    width:300px;
}

Kode yang berwarna merah di atas adalah id untuk CSS anda. Coba anda copy kode di atas pada notepad lalu save dengan nama contoh.css jangan lupa save dengan format UTF-8 dan type all files. Kemudian copy kode html di bawah kemudian save dengan nama test.html

<html>
<title>Test</title>
<link href="file:///C:/Users/Eris/Desktop/contoh.css" rel="stylesheet" type="text/css" media="screen"></link>
<body>
<div class='contoh'>
Ini Hanya Untuk Test
</div>
</body>
</html>

Ganti tulisan berwarna merah di atas dengan lokasi tempat anda menyimpan kode css yang sudah anda save tadi. Saya save kode css dan htmlnya di dekstop. Inilah hasil dari HTML + Kode CSS pada browser:


Pada screenshoot di atas anda dapat melihat fungsi dari CSS yaitu text-align yang berfungsi untuk menampilkan objek ke tengah halaman, width berfungsi untuk membatasi ukuran halaman object menjadi maksimal 300px. Sedangkan fungsi <link href="file:///C:/Users/Eris/Desktop/contoh.css" rel="stylesheet" type="text/css" media="screen"></link> adalah untuk menetukan lokasi CSS dan fungsi <div class='contoh'> adalah untuk memanggil kode CSS.

Saya rasa dengan contoh di atas anda sudah mulai paham tentang cara memasukkan CSS kedalam dokumen HTML dan kode untuk memanggil.menggunakan fungsi CSS nya, contoh di atas adalah contoh paling sederhana dalam menerapkan CSS pada dokumen HTML. Mungkin sekian saja artikel mengenai CSS kali ini, kode CSS dan fungsinya yang lain akan saya bahas pada artikel selanjtnya, terima kasih.

Subscribe to receive free email updates:

1 Response to "Mengenal Fungsi CSS Paling Sederhana Untuk HTML"

  1. waaah artikel ini membantu banget gan,,buat para newbie spt saya

    BalasHapus

Komentar, kritik dan saran dari anda adalah motivasi untuk berkembangnya blog ini.
Mohon tidak berkomentar dengan kata yang mengandung unsur kekerasan, porno dan sara.
Komentar tidak memerlukan verifikasi kata. Terima kasih.