Perkenalan CSS

advertisement
•Perkenalan CSS
•Menerapkan CSS di HTML
•kelas
•ID
•universal
•Group
•comments
Memisahkan style dengan struktur
HTML
adalah dengan CSS (Cascading Style
Sheet)
CSS digunakan oleh penulis maupun
pembaca halaman web untuk
menentukan warna, jenis huruf, tata
letak, dan berbagai aspek tampilan
dokumen
Pemisahan ini dapat meningkatkan
aksesibilitas isi, memberikan lebih
banyak keleluasaan dan kontrol
terhadap tampilan, dan mengurangi
kompleksitas serta pengulangan pada
stuktur isi.
Agar CSS dapat berfungsi di halaman
Web
maka terdapat aturan-aturan yang
dinamakan
CSS Rules
Selectors
Karakter alfanumerik sebagai identitas rule
Selector bisa berupa: HTML tag, class, dan
ID
Properties
Aturan yang akan diterapkan kepada
selector
Values
Nilai yang diberikan kepada properties
1.HTML Selector
2.Class Selector
3.ID Selector
HTML Selector
Selector untuk tagtag HTML
h1 { color: red }
Akan bekerja untuk
semua tag
<h1>...<h1>
Class
Aturan tambahan yang dapat diterapkan
pada tag HTML
.myClass { font: bold 1.25em times; }
Diterapkan berupa
<h1 class=”myClass”>...</h1>
ID
Sama seperti class, dapat diterapkan pada
berbagai tag HTML
Diterapkan hanya satu kali pada tag HTML,
tidak seperti class yang bisa berkali-kali
#myObject { position : absolute; top:
10px; }
Diterapkan berupa
<h1 id=”myObject”>...</h1>
Terdapat 3 metode:
1. Inline Stylesheet
di dalam elemen HTML
2. Internal Stylesheet
di dalam tag <head>
3. External Stylesheet
Memberikan style pada tag HTML
langsung
<h1 G
style G
color:red;” G
color G
red G
/h1> G
tag HTML pembuka
atribut style
deklarasi
property
value
tag HTML penutup
Ketikkan
Styledi dalam tag HTML yang
akan diberi style
Tambahkan deklarasi CSS dengan daftar
yang dipisahkan dengan koma
font: italic bold small caps;
color: red;
Tambahkan isi dan Tutup tag HTML
<h1>Pukulan Kunyuk Melempar Buah</h1>
<body>
<h1 style="font:Constantia, Georgia, Times, ©Times
New Roman©, Serif; color:red;">Pengantar</h1>
<p>
Ebook adalah elektornik book
</p>
<h1>Mengenal Ebook </h1>
<p style="color:blue;">
singkatan dari Electronic Book atau buku elektronik. E-book tidak lain adalah
sebuah bentuk buku yang dapat dibuka secara elektronis melalui komputer.
E-book ini berupa file dengan format bermacam-macam,
ada yang berupa pdf (portable document format) yang dapat dibuka dengan
program Acrobat Reader atau sejenisnya. Ada juga yang dengan bentuk
format htm, yang dapat dibuka dengan browsing atau internet eksplorer
secara offline.
</p>
</body>
Download