Scribd
Unggah
9 tayangan3 halaman

Dasar CSS

Dokumen ini menjelaskan tiga cara penggunaan CSS: inline CSS, embedded CSS, dan external CSS. Inline CSS ditambahkan langsung ke tag HTML, embedded CSS disisipkan dalam tag <style> di bagian <head>, dan external CSS menggunakan file terpisah yang dipanggil dalam dokumen HTML. Contoh kode disertakan untuk masing-masing metode penggunaan CSS.

Diunggah oleh

nurlaili.galek
Hak Cipta
© All Rights Reserved
Kami menangani hak cipta konten dengan serius. Jika Anda merasa konten ini milik Anda, ajukan klaim di sini.
Format Tersedia
Unduh sebagai PDF, TXT atau baca online di Scribd
9 tayangan3 halaman

Dasar CSS

Dokumen ini menjelaskan tiga cara penggunaan CSS: inline CSS, embedded CSS, dan external CSS. Inline CSS ditambahkan langsung ke tag HTML, embedded CSS disisipkan dalam tag <style> di bagian <head>, dan external CSS menggunakan file terpisah yang dipanggil dalam dokumen HTML. Contoh kode disertakan untuk masing-masing metode penggunaan CSS.

Diunggah oleh

nurlaili.galek
Hak Cipta
© All Rights Reserved
Kami menangani hak cipta konten dengan serius. Jika Anda merasa konten ini milik Anda, ajukan klaim di sini.
Format Tersedia
Unduh sebagai PDF, TXT atau baca online di Scribd

ra Menggunakan CSS

Cara Menggunakan
CSS
Ada 3 cara penggunaan css yaitu inline css, embedded css, external css.

1. Inline CSS
Inline css merupakan cara penggunaan css dengan menambahkan langsung di tag
dokumen htmlnya sebagai atribut.

Contoh:

<!DOCTYPE html>
<html>
<head>
<title>Inline CSS</title>
</head>
<body>
<p style="color:blue">Membuat tulisan warna biru</p>
<p style="font-style:italic;">Membuat tulisan miring</p>
</body>
</html>

Penulisan CSS dengan cara inline ini di mulai dengan kata style lalu di ikuti dengan
syntax property: value.

2. Embedded CSS
Embedded CSS merupakan cara penggunaan css yang disisipkan di dalam tag
<style> ...</style>. Tag style tersebut disimpan di antara tag <head>...</head>

Contoh:

<!DOCTYPE html>
<html>

2
<head>
<style>
p{
color:green;
font-family:arial;
font-size:120%;
}
</style>
</head>

<body>
<p>Belajar Css Mudah</p>
<p>Pengaturan paragraf dengan menggunakan CSS di dalam
header dokumen html</p>
<p>Dengan contoh ini, maka setiap paragraf atau yang
berada diantara </p><p>dan</p>akan memiliki format yang
sama
</body>

</html>

3. External CSS

Cara ini menggunakan file Css yang dituliskan secara terpisah dengan dokumen
html. Dengan cara ini, anda hanya perlu memiliki satu set kode CSS yang digunakan
untuk semua halaman web anda.
Ada dua langkah yang harus dikerjakan untuk menggunakan css dengan cara ini

1. Anda membuat satu file dengan notepad atau teks editor lain, dan berinama,
misalkan: [Link], lalu tuliskan kode-kode css di dalam file tersebut.

p{
font-family: arial;
font-size: small;
}
h1{
color: red;
}

3
2. Langkah kedua adalah memanggil file [Link] dari semua halaman web. Caranya
dengan memasukkan kode di bawah ini yang disisipkan di antara tag <head> dan
</head>

<!DOCTYPE html>
<html>
<head>
<title>External CSS File</title>
<link rel="stylesheet" href="[Link]" type="text/css"></link>
</head>
<body>
<h1>Belajar External CSS</h1>
<p>Sungguh Mudah Sekali belajar CSS File External</p>
</body>
</html>

Anda mungkin juga menyukai