Menghubungkan HTML dengan CSS

Assalamualaikum 😊 Kali ini saya akan sharing bagaimana cara menghubungkan HTML dengan CSS. Silakan mencoba! 😊

Salin kode program di bawah ini dan simpan file dengan nama index1.html

Salin juga kode program di bawah ini dengan nama style1.css

Jika sudah, jadikan dalam 1 folder. Double click file HTML-nya, maka akan muncul tampilan seperti dibawah ini:

Penjelasan:

Elemen HTML	Penjelasan
<!DOCTYPE HTML>	untuk menginformasikan pada browser bahwa dokumen yang sedang dibuka adalah tipe dokumen HTML5.
<html>...</html>	Untuk membuat dokumen html.
<head>...</html>	Mendefinisikan bagian kepala dokumen html.
<title> ... </title>	Menampilkan teks pada judul browser atau pada tab browser.
<body>... </body>	Mendefinisikan body/isi dokument html.
<link>	Untung menggabungkan HTML dengan CSS.
rel=”stylesheet” type=”text/css”	Sebuah deklarasi untuk menjelaskan bahwa file yang kita panggil atau hubungkan adalah file stylesheet atau CSS.
href=” ”	Untuk meletakkan lokasi dan nama file CSS yang ingin kita hubungkan .
<div>...</div>	Mengelompokan elemen agar menjadi 1 grup. Atau, untuk membatasi bagian satu dengan bagian yang lainnya.
class=” “	Mengidentifikasikan (mengkategorikan) sebuah gaya dalam objek HTML.
id=” “	Untuk menentukan bagian yang hanya ada satu pada halaman dan juga menentukan stylenya.

Salin kode program di bawah ini dan simpan file dengan nama M5lat1.html

Salin juga kode program di bawah ini dengan nama styleM5lat1.css

Jika sudah, jadikan kedua filenya dalam 1 folder. Double click file HTML-nya, maka akan muncul tampilan seperti dibawah ini:

Penjelasan:

Elemen HTML	Penjelasan
<!DOCTYPE HTML>	untuk menginformasikan pada browser bahwa dokumen yang sedang dibuka adalah tipe dokumen HTML5.
<html>...</html>	Untuk membuat dokumen html.
<head>...</html>	Mendefinisikan bagian kepala dokumen html.
<title> ... </title>	Menampilkan teks pada judul browser atau pada tab browser.
<body>... </body>	Mendefinisikan body/isi dokument html.
<link>	Untung menggabungkan HTML dengan CSS.
rel=”stylesheet” type=”text/css”	Sebuah deklarasi untuk menjelaskan bahwa file yang kita panggil atau hubungkan adalah file stylesheet atau CSS.
href=” ”	Untuk meletakkan lokasi dan nama file CSS yang ingin kita hubungkan .
<h2>... </h2>	Membuat heading 2.
<ol> ...</ol>	Untuk membuat daftar berurut
<li>...</li>	Item yang terdapat di dalam list/daftar
<ul>...</ul>	Untuk membuat daftar tidak berurut

Devi Syeli Fitriani