Perkenalan CSS
Objektif Perkenalan CSS Menerapkan CSS di HTML kelas ID universal Group comments
Perkenalan CSS 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.
Dasar Selector CSS Agar CSS dapat berfungsi di halaman Web maka terdapat aturan-aturan yang dinamakan CSS Rules
C CSS Rules
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
Terdapat tiga macam selector: HTML Selector Class Selector ID Selector
Macam-macam Selector HTML Selector Selector untuk tag-tag HTML h1 { color: red } Akan bekerja untuk semua tag <h1>...<h1>
Class Macam-macam Selector 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>
Tabel Dasar Selector
Menerapkan CSS pada HTML Terdapat 3 metode: Inline Stylesheet di dalam elemen HTML 2. Internal Stylesheet di dalam tag <head> 3. External Stylesheet
Inline Stylesheet Memberikan style pada tag HTML langsung <h1 G tag HTML pembuka style G atribut style color:red;” G deklarasi color G property red G value /h1> G tag HTML penutup
Inline Stylesheet 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. </body>