Untuk memasukan atau menggunakan Script CSS ke dalam HTML ada 3 cara yang dapat dilakukan. Yaitu bisa dengan cara Inline Style, header style dan juga bisa dengan menggunakan Linked CSS.
1. Untuk pertama-tama kita bahas terlebih dahulu mengenai cara Inline style, Inline style merupakan salah satu cara yang dapat dilakukan untuk menggunakan atau memasukan sript CSS ke dalam HTML dengan cara menuliskan Script CSS satu persatu ke dalam HTML.
Untuk lebih jelasnya perhatikan Sript di bawah ini :
Dapat terlihat komposisi Sript CSS di atas menggunakan style="property : value"> menjadi style="color : red".
<html>
<header>
<title>Belajar CSS</title>
</header>
<body>
<p style="color : red"> Teks ini berwarna merah </p>
<p style="color : Blue"> teks ini berwarna biru </P>
<p style="color : green"> teks ini berwarna hijau </p>
</body>
</html>
Untuk melihat hasilnya anda bisa copy sript di atas ke dalam notepad, lalu safe dengan format ( .HTML ).
dapat terlihat terjadi perbedaan warna di setiap kalimatnya.
2. Yang ke dua anda bisa menggunakan header style, dimana kita dapat menuliskan sript CSS pada bagian header. Di mana bagian script html terpisah dengan scipt CSS. Bagian HTML terletak di bagian body sedangkan bagian CSS terletak di bagian Header.
Keunggulan dengan menggunakan cara ini kita tidak perlu menuliskan satu per satu sript HTML tapi cukup hanya dengan menuliskan Script CSS yang di butuhkan maka script CSS dapat digunakan di setiap tag HTML.
Untuk lebih memahainya silahkan lihat contoh di bawah ini :
<head>Dari contoh di atas dapat dilihat bahwa semua yang berada di dalam tag h3 akan memiliki apa yang telah di tuliskan pada bagian CSS di header tadi, yaitu akan memiliki font calibri, berwarna merah dan juga di cetak miring.
<title> Belajar tutorial CSS</title>
<style>
h3 {font-family : calibri;
color : red;
font-style : italic}
</style>
</head>
<Body>
<h3>kalimat ini memiliki font jenis calibri, warna merah dan juga di cetak miring</h3>
</body>
</html>
3. Yang ketiga adalah dengan menggunakan Linked CSS. Linked CSS adalah salah satu cara untuk memasukan menggunakan Script CSS dimana, sript html dipisahkan dengan sript CSS, lalu di hubungkan dengan link.
Untuk lebih jelasnya lagi silahkan ikuti petunjuk di bawah ini :
A. Buka notepad, notepad ini digunakan untuk menuliskan sript CSS.
lalu copy paste cript CSS berikut
h3 {font-family : calibri;Setelah itu save notepad
color : red;
font-style : italic}
B. Buka notepad kembali, notepad yang satu ini di gunakan untuk menuliskan sript HTML.
Lalu copy paste sript HTML berikut
<head>lalu save as file notepad tersebut di folder yang sama dengan file notepad CSS. Tulisan yang berwarna biru di atas mewajibkan anda untuk menuliskan nama fie notepad HTML yang telah ada simpan, Contoh : format.css.
<title> Belajar tutorial CSS</title>
<link rel="stylesheet" href="Tulis nama file notepad Css yang telah di save" type="text/css">
</head>
<Body>
<h3>kalimat ini memiliki font jenis calibri, warna merah dan juga di cetak miring</h3>
</body>
</html>
Tidak ada komentar:
Posting Komentar
Berkomentarlah Yang Membangun Dan Tanpa Link