Perbedaan html dengan css

perbedaan html dengan css

Dalam bidang desain web, HTML dan CSS dianggap sebagai sesuatu yang wajib digunakan dalam menyusun sebuah halaman web/blog. Hal itu sangatlah wajar karena perpaduan keduanya mampu menciptakan sebuah tampilan menarik, disukai mesin pencari, optimal dari segi kecepatan. Tapi apakah mereka bisa dipisahkan? seperti apa jika itu dilakukan? Apa perbedaan html dan css? Artikel berikut ini akan membantu anda membedakan HTML dengn CSS dari segi fungsi serta penulisan.

Apa itu html?

HTML adalah kependekan dari Hyper Text Markup Language yang artinya bahasa penandaan halaman web. Elemen HTML yang disebut dengan TAG digunakan untuk menyusun struktur isi halaman web.

HTML ditulis dengan struktur tertentu yang menginformasikan kepada browser tentang susunan isi halaman yang di tampilkan. Contoh :

<h1>Ini contoh Heading</h1>
<p>Ini adalah contoh sebuah paragraf dalam HTML</p>

dengan tag diatas, browser akan menampilkan isi dengan baris awal heading 1, dan baris kedua sebuah paragraf. Heading dianggap sebagai sebuah kata pembuka atau judul dari halaman, sedangkan paragraf adalah sebagai isi halaman.

HTML bisa berdiri sendiri tanpa ada pendukung lainya seperti css.

Apa itu css?

CSS adalah kependekan dari Cascading Style Sheet yang artinya pengatur gaya dokumen. CSS digunakan untuk mengatur tampilan struktur isi halaman web.

Karena css digunakan untuk mengatur tampilan struktur isi maka css harus mengacu pada elemen tertentu dari dokumen yang diformat. Sehingga penulisanya :

h1 { color : #000;font-size:20px; }
.tengah { text-align:center; }

Contoh css diatas digunakan untuk mengatur format semua elemen h1 sehinga ditampilkan dengan warna:#000 (hitam) dan font-size:20px (ukuran tulisan 20 pixel). Sedangkan .tengah adalah sebuah class yang dapat ditempelkan pada elemen tertentu seperti p, div, dll. Misal : <p class="tengah">..</p> sehingga furmat paragraf berubah menjadi rata tengah.

Kemampuan umum CSS

  1. Memformat banyak dokumen hanya dengan satu file css
  2. Mengatur susunan layout dokumen
  3. Mengatur tampilan dalam berbagai format output seperti printer, layar monitor, mobile dll
  4. Menambah fitur kontrol dokumen seperti show, hide, visible dll

Semoga bermanfaat

Zainal Hakim

 

** Bebas disunting dengan menyebutkan sumber **

Artikel Lainnya

  • Referensi warna untuk HTML dan CSS
    Warna yang terlihat disebuah website/blog sangatlah bervariasi dan memiliki daya tarik tersendiri terhadap pengunjung, pingin tau lengkap referensi warna untuk HTML maupun CSS, silahkan baca panduan berikut.
  • Membuat halaman web dengan latar background bintang dengan css
    Website atau halaman web biasanya dibuat semenarik mungkin, bisa dengan menggunakan gambar, tulisan, animasi ataupun dengan hiasan objek lainnya. Berikut ini saya akan berbagi tentang bagaimana membuat halaman web dengan latar atau background bintang dengan perintah CSS
  • Membuat tampilan layout 3 kolom dengan css
    Membuat layout halaman web dengan css sangatlah mudah dan tidak menggunakan perintah yang rumit. Pada artikel singkat berikut ini saya akan menjelaskan bagaiman cara membuat tampilan halaman web dengan susunan tiga kolom. Contoh yang saya buat sengaja dirancang sederhana agar dapat digunakan untuk berbagai keperluan. Lihat kode berikut ini :
  • Membuat header tetap diatas halaman
    Banyak variasi tampilan header atau footer yang digunakan untuk menghiasi halaman web dan dapat kita temukan diinternet, mulai dari yang sekedar tulisan judul, gambar logo sampai dengan model otomatis muncul dan hilang. Pada tulisan berikut ini, saya akan berbagi trick cara membuat header dan footer yang tetap diatas dan dibawah bagian halaman.
  • Kenapa menggunakan css (Cascading Style Sheets)
    CSS sudah tidak asing lagi dikalangan para blogger atau pengembang website karena css sangat mudah digunakan dan cara penulisannya pun sangat gampang diingat. Tapi tahukah anda masih banyak lagi alasan kenapa css menjadi idola para blogger dan pengembang? Dalam artikel ini saya akan mengemukaan alasan-alasan kenapa menggunakan css.

Kiriman terbaru