View

Contoh penggunaan property font-family CSS dengan HTML

Contoh penggunaan property font-family CSS dengan HTML   Berikut adalah contoh penggunaan property font-family dalam CSS:   <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>Belajar CSS di Duniailkom</title>    <style type="text/css"> body { font-family: Calibri, Helvetica, Arial, sans-serif; } h3 { font-family: Cambria,"Times New Roman",serif; } #paragraf2 { font-family: Georgia, serif; } </style [...]

View

Cara Menggunakan Font External dalam CSS

Cara Menggunakan Font External dalam CSS Sebagai tutorial cara menggunakan font external dengan CSS, kita terlebih dahulu harus menyiapkan font yang akan digunakan. Dalam tutorial kali ini saya akan menggunakan font : DIGITAL-7_2.TTF. Font ini saya ambil dari folder font dalam sistem Windows 7. Anda boleh bebas menggunakan font jenis lain, namun letakkan di dalam folder yang sama dengan kode HTML yang akan kita buat agar mudah mengetikkan lokasi file font-nya.   Jika sudah, berikut adalah contoh kode HTML dan CSS untuk menjalankan file font external:   <!DOCTYPE html> <html> <head> <title>Belajar Font [...]

View

Cara Menggunakan Google Font Dalam CSS

Cara Menggunakan Google Font Setelah memilih jenis font dan cara yang akan digunakan, maka kita akan langsung mencobanya dengan kode CSS. Berikut adalah kode HTML dan CSS yang saya gunakan:   <!DOCTYPE html> <html> <head> <title>Belajar Google Font</title> <link href='http://fonts.googleapis.com/css?family=Lobster|Open+Sans' rel='stylesheet' type='text/css'> <style type="text/css">    .open{ font-family: 'Open Sans', sans-serif;       & [...]

View

Property font-size Dalam CSS

Mengenal Property font-size Dalam CSS Untuk mengubah besar atau ukuran dari sebuah font atau teks dengan CSS, kita menggunakan properti font-size. Properti font-size cukup sederhana dan ditulis seperti contoh berikut ini:   p { font-size: 14px; } Dengan menulis kode CSS diatas, semua teks di dalam tag akan memiliki font dengan ukuran 14 pixel.   Yang membuat menarik (dan juga memusingkan) adalah CSS menyediakan banyak “satuan ukuran” teks yang bisa dipilih, dimulai dari pixel seperti contoh diatas, keyword seperti small, medium, large, ukuran satuan persen, em, dan juga ukuran lain seperti cm, mm, pt, dan pica.   Ukura [...]

View

Satuan Ukuran Font: Pixel (px) Dalam CSS

Satuan Ukuran Font: Pixel (px) Dalam CSS Satuan ukuran pixel relatif mudah dipahami karena ia tidak terikat dengan setingan browser. Ketika kita mendefenisikan ukuran font sebesar 20 pixel, maka web browser akan menampilkannya sebesar (tentu saja) 20 pixel. Satuan pixel ini banyak digunakan karena ditampilkan secara konsisten di dalam berbagai web browser.   Berikut adalah contoh kode CSS untuk penggunaan pixel dalam mengubah ukuran text:                    .satu {    font-size: 12px;    }    .dua {    font-size: 20px; [...]

View

Satuan Ukuran Font: Persen (%) Dalam CSS

Satuan Ukuran Font: Persen (%) Dalam CSS   Satuan persen adalah satuan yang bersifat relatif. Perhitungan ukuran persen akan mendapatkan ukuran font dari setingan parent element. Jika kita mendefenisikan ukuran font tag sebesar 100%, maka tag akan memiliki ukuran yang sama dengan parent element. Namun jika tag dibuat sebesar 120%, maka ukurannya akan sebesar 120% dari parent element. Apa sebenarnya yang dimaksud dengan parent element ini? Parent element adalah tag induk dimana selector CSS tersebut berada didalamnya. Misalkan kita memiliki kode HTML berikut ini:         Di suatu tempat yang jauh, sebuah keluar [...]

View

Konsep penggunaan persen Dalam CSS

Konsep penggunaan persen Dalam CSS   Agar lebih mudah memahami konsep penggunaan persen sebagai ukuran font, berukut adalah contoh kode HTML dan CSSnya:                    .satu {    font-size: 100%;    }    .dua {    font-size: 16px;    }    .tiga {    font-size: 80%;    }    span {    font-size: 80%;    color: blue;    }         Belajar CSS: font-size "persen (%)&am [...]

View

Satuan Ukuran Font: em Dalam CSS

Satuan Ukuran Font: em Dalam CSS Jika anda telah memahami cara penggunaan satuan persen, maka anda tidak akan kesulitan memahami satuan em, karena keduanya nyaris sama. Web desainer lebih banyak menggunakan em karena em berasal dari konsep typography.   Karena penggunaannya sama dengan satuan persen, maka kita akan langsung kepada contoh kode CSS dan HTML penggunaan satuan em:                    body {    font-size: 14px;    }    .satu {    font-size: 1em;    }    .dua {    font-size: [...]