#heading1 { text-transform : uppercase; } #heading2 { text-transform : lowercase; #heading3 { text-transform : capitalize; "> #heading1 { text-transform : uppercase; } #heading2 { text-transform : lowercase; #heading3 { text-transform : capitalize; ">

Presentasi sedang didownload. Silahkan tunggu

Presentasi sedang didownload. Silahkan tunggu

Mengubah Text Case Dengan CSS, Anda dapat pula mengubah suatu teks menjadi huruf kecil semua (lowercase), besar semua (uppercase), atau capitalize (hanya.

Presentasi serupa


Presentasi berjudul: "Mengubah Text Case Dengan CSS, Anda dapat pula mengubah suatu teks menjadi huruf kecil semua (lowercase), besar semua (uppercase), atau capitalize (hanya."— Transcript presentasi:

1 Mengubah Text Case Dengan CSS, Anda dapat pula mengubah suatu teks menjadi huruf kecil semua (lowercase), besar semua (uppercase), atau capitalize (hanya huruf pertama dari kata yang dibuat besar). Hal ini dilakukan dengan menggunakan properti text-transform : option; dengan option dapat diganti dengan lowercase, uppercase, atau capitalize.

2 Contoh <style type="text/css"> #heading1 {
text-transform : uppercase; } #heading2 { text-transform : lowercase; #heading3 { text-transform : capitalize; </style>

3 Membuat Drop Cap Ingin mempercantik tampilan paragraf dengan menambahkan drop cap pada huruf pertamanya? Berikut ini contoh penulisan style untuk membuat hal tersebut. contoh : <style type="text/css"> p.styleku:first-letter { float: left; font-family: "Lucida Grande"; font-size: 80px; } p { text-align : justify; </style>

4 Membuat Text Decoration
Anda dapat membuat text decoration seperti underline, overline, line-trough, maupun blink dengan properti text-decoration : option; dengan option dapat diganti dengan underliner, overline, line-trough atau blink. Untuk melihat perbedaannya, perhatikan contoh berikut.

5 Contoh <style type="text/css"> #heading1 {
text-decoration : blink; /* membuat teks berkelap kelip */ } #heading2 { text-decoration : line-through; /* membuat garis ditengah text/ dicoret */ #heading3 { text-decoration : underline; /* membuat garis bawah */ #heading4 { text-decoration : overline; /* membuat garis di atas text */ </style>

6 Membuat Layout dengan CSS
Dengan CSS, Anda tidak membutuhkan tabel dalam menata layoutnya. Kelebihan CSS dalam layout web dibandingkan tabel adalah fleksibilitas dan juga lebih meminimalisasi jumlah byte file. Apabila Anda menggunakan tabel untuk mendesain layout, maka semakin banyak sel yang dibuat, akan semakin besar ukuran byte file dan akibatnya loading web pun membutuhkan waktu yang lebih lama. Untuk membuat layout dengan CSS hal terpenting yang harus dilakukan adalah membagi elemen halaman ke dalam division-division tertentu.

7 Contoh <html> <head>
<title>Universitas Darwan Ali</title> </head> <body> <div id="header"> <h1>Universitas Darwan Ali</h1> </div> <div id="navigasi"> <h3>Menu Navigasi</h3> <ul> <li><a href="home.htm">Home</a></li> <li><a href="fakultas.htm">Fakultas</a></li> <li><a href="profil.htm">Profil</a></li> <li><a href="agenda.htm">Agenda</a></li> </ul>

8 http://karyasaidah.wordpress.com/ </div> <div id="isi">
<img src="img/screenshot.png" width="434" height="238"/> <p>Universitas Darwan Ali meluncurkan undaOS. UndaOS merupakan system operasi berbasis Linux. Unda OS program dengan media open sources atau yang lebih dikenal dengan Linux. Meski tampilannnya hampir sama dengan windows 7, namun didalamnya sudah disetting dengan bahasa Indonesia. Hebatnya lagi, program ini tidak memerlukan antivirus.</p> <p>Ide kreatif ini muncul karena kondisi dimana hampir semua pengguna komputer memakai sistem operasi Windows bajakan, karena membeli yang original biaya yang dikeluarkan sangat mahal. Linux bisa didesain berbahasa Indonesia ataupun bahasa lokal.</p> <p>Didalam undaOS ini aplikasi yang digunakan adalah kemel Linux versi , tampilan grafis didukung GNOME Environment, juga diisi Window Virtual Machine (WINE) dengan memberikan kemampuan undaOS layak seperti Windows , serta penunjang modul pendidikan dan modul keamanan ditambah modul perkantoran dan repository server yang bisa memberikan update dan aplikasi secara nyaman dan cepat.</p> <div id="footer"> <p>Copyright © 2011 by dhombeng</p> </body> </html>


Download ppt "Mengubah Text Case Dengan CSS, Anda dapat pula mengubah suatu teks menjadi huruf kecil semua (lowercase), besar semua (uppercase), atau capitalize (hanya."

Presentasi serupa


Iklan oleh Google