Kehadiran HTML5 merupakan terobosan besar dalam dunia internet khususnya untuk mendesain sebuah website. HTML5 hadir dengan banyak fitur baru, namun juga menghilangkan beberapa fitur yang ada di HTML versi sebelumnya. Di dalam membuat website, HTML mempunyai peran untuk menentukan struktur dan tipe konten seperti paragraf, heading, list, image, canvas dan multimedia, sedangkan CSS berperan menentukan tampilan laman web seperti background, margin, warna, font-family, alignment dan sebagainya.

CSS tidak bergantung pada HTML dan dapat digunakan dengan bahasa markup berbasis XML apa pun. Dalam implementasinya, CSS dapat disertakan langsung di dalam file HTML dan dapat pula diletakkan di dalam file terpisah. CSS sebagai file terpisah lebih disukai karena dapat digunakan di lebih dari satu file HTML dan menjadikan tampilan halaman web (web page) lebih seragam.

Apabila CSS disertakan langsung ke dalam file HTML, ini akan menjadi lebih sulit ketika melakukan perubahan pada tampilan website yang sedang dibuat, terlebih lagi bila perubahan tersebut terjadi pada banyak file HTML. Berikut ini adalah contoh korelasi antara HTML dan CSS dimana sebuah file HTML menentukan konten web dan file CSS berfungsi untuk memperindah tampilan.

<!DOCTYPE html>
<html>
<head>
<title>Korelasi CSS dan HTML</title>
<link rel="stylesheet" type="text/css" href="cssfile/cssparagraf1.css">
</head>
<body>
<h1>API Dan Edisi Java</h1>
<p>Setiap bahasa pemrograman mempunyai sintak penulisannya sendiri. Apabila Anda mengabaikan aturan tersebut, komputer tidak bisa mengenali dan mengerti kode program yang ditulis. Spesifikasi bahasa Java adalah definisi teknis bahasa Java yang memuat sintak dan semantik. Spesifikasi bahasa Java dan API (Application Program Interface) Java menetapkan standar tersebut.</p>
<p>API Java memuat kelas (class) dan interfes (interface) yang digunakan untuk membuat dan mengembangkan program Java. Spesifikasi bahasa Java relatif tidak berubah, tetapi API Java akan terus mengalami perkembangan. Anda dapat mengunduh versi  terbaru Java (J2SE) serta memperbaharui API Java di situs resminya.</p>
</body>
</html>

File CSS cssparagraf1.css yang memperindah tampilan file HTML.

body {background-color: #f9fab0}
h1 { color: #f73110; text-align: center}
p {color: #1807bd; font-family: "Tahoma"; font-size: 12px}

Hasil tampilan file HTML yang telah diperindah dengan file CSS di bagian elemen link.

Korelasi CSS dan HTML

SUKAI DAN BAGIKAN ARTIKEL INI:
Pin It