Banner CSS

Korelasi Antara CSS Dan HTML

Kehadiran HTML5 merupakan terobosan besar dalam dunia internet khususnya untuk mendesain sebuah website. HTML5 hadir dengan banyak fitur baru dan juga menghilangkan beberapa fitur lain yang dimiliki HTML versi sebelumnya. Dalam pembuatan website, HTML5 berperan menentukan banyak tipe konten seperti heading, paragraf, list, image, canvas, multimedia dan sebagainya, sedangkan CSS berperan menentukan background, margin, warna, font-family, alignment dan sebagainya.

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 oleh 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-perubahan pada tampilan website yang sedang dibangun, terlebih lagi apabila perubahan terjadi pada banyak file HTML. Berikut ini adalah contoh halaman web dimana sebuah file HTML menentukan konten web dan file CSS berfungsi untuk memperindah tampilan.

File HTML paragraf1.html yang menentukan tipe konten website dan disimpan di direktoriC:/html5.

<!DOCTYPE html>
<html>
<head>
<title>Termas Media</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>
<p>Ada tiga edisi  API Java yaitu J2SE (Standart Edition), J2EE (Enterprise Edition) dan J2ME 
(Micro Edition). J2SE sendiri mempunyai banyak versi. Versi terbaru J2SE adalah J2SE 7.0 (J2SE1.7). 
Pengembang Java merilis setiap versi J2SE dengan Java  Development Kit (JDK). Untuk Java 
Development Kit dari J2SE 7.0 adalah JDK 7.0.</p>
</body>
</html>

File CSS cssparagraf1.css yang memperindah tampilan website dan disimpan di direktori C:/html5/cssfile.

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

Tampilan file paragraf1.html yang dijalankan di Microsoft Internet Explorer versi 9.0.8112.

 Korelasi antara CSS dan HTML

Untuk memperbaiki mutu konten, Anda dapat berpartisipasi dengan cara melaporkan apabila menemukan kesalahan ketik, kata-kata rangkap, redaksi kurang pas (jelas), gambar pendukung tidak ada dan sebagainya melalui form Kontak Kami untuk mendapatkan perbaikan. Terima kasih atas kerjasamanya.

Hindro HindriantoHindro adalah pendiri sekaligus admin termasmedia.com dan topikit.com, blog online yang mengulas teknologi informasi. Dunia web mulai ditekuni tahun 2012 dengan mempelajari CMS Joomla dan Wordpress. Beberapa buku yang sekarang dipelajari antara lain PHP, HTML5, ASP.NET 4.5, JavaScript, CSS3, MySQL, Adobe Dreamweaver, Adobe Photoshop dan Adobe Flash.