Muhammat Rasid Ridho

Aturan Penggunaan CSS

 

Bentuk umum :

selector   {property: value}

selector (elemen yang akan didefinisikan)

property (atribut yang akan diubah)

value (nilainya)

 

Antara property dan nilai sisahkan dengan titik-dua(colon):

 

body { color: black }

 

Jika nilai berupa beberapa kata gunakan petik ganda:

p { font-family: “sans serif” }

Jika lebih dari satu property pisahkan dengan titik-koma (semi colon) :

p { text-alig: center ; color: red }

Jika igin lebih mudah dibaca:

p

{

text-alig: center ;

color: red ;

font-family: arial

}

Jika selector dikelompokan :

h1, h2, h3,h4, h6

{

color: blue

}

 

Jika menggunakan atribut class (dalam definisi CSS):

p.kanan {text-align: right}

p.kiri {text-align: left}

Dalam dokumen HTML menggunakan definisi class :

<p class=”kanan”> Ini kalimat </p>

<p class=”kiri”> Ini kalimat </p>

Jika menggunakan ID atribut :

#kanan { text-align: right }

 

Dalam dokumen HTML menggunakan ID atribut :

<p id=”kanan”> Ini kalimat  </p>

<h3 id=”kanan”> Ini header </h3>

 

 

 

 

 

 

Style Sheet External

Style sheet yang didefinisikan secara eksternal dimana Pengaturan1.css digunakan untuk  Eksternal.html

Ekstensi filenya harus disimpan dalam ”*.css”.

 

Pengaturan1.css  yang berisi :

 

body {background-color:yellow}

h1 {font-size: 36 pt}

h2 {color:blue}

p {margin-left:50px}

 

Eksternal.html dengan kode:

 

<html>

<head>

<title> CSS External </title>

<link rel=”stylesheet” type=”text/css” href=”Pengaturan1.css”>

</head>

<body>

<h1> Header dengan 36 pt </h1>

<h2> Header 2 warna biru </h2>

<p> Paragraf dengan left-margin 50 px </p>

</body> </html>

Pengaturan2.css yang berisi :

 

body {background-color: tan}

h1 {color: maroon; font-size: 20 pt}

h2 {color: blue}

p {font-size: 11pt; margin-left :15px}

a:link{color:green}

a:visited{color:yellow}

a:active{color:blue}

a:hover{color:black; text-decoration:none }

 

Eksternal2.html dengan kode:

<html>

<head> <title> CSS External </title>

<link rel=”stylesheet” type=”text/css” href=”Pengaturan2.css”>

</head>

<body>

<h1> Header 1 </h1>

<h2> Header 2 warna biru </h2>

<p> Paragraf dengan left-margin 50 px </p>

<a href=”http://www.emerer.com”> Pak Rasid</a>

</body> </html>

Style Sheet Internal

Berikut style sheet yang didefinisakan secara internal, karena web page tertentu bersifat unik.

<html>

<head><title> CSS Internal </title>

<style type=”text/css”>

body { background-image:url(‘kayu.jpg’)}

hr {color: red}

p {font-size: 11pt; margin-left: 15px ; color:lime}

</style>

</head>

<body><p> Ini paragraf </p>

<hr>

</body> </html>

Style Sheet Inline

Hanya bisa dilakukan pada lokasi yang spesifik. Bisa dilakukan tetapi tidak dianjurkan, akan menyebabkan dokumen lebig besar karenaharus didefinisi satu persatu.

<html>

<head>

<title> CSS Inline </title>

</head>

<body>

<p style=”font-size: 20pt; margin-left: 15px ; color:sienna”> Ini paragraf </p>

</body></html>

Multi Style Sheet

Jika digunakan lebih dari satu definisi dari style sheet maka nilai yang tidak didefinisikan akan diinheritkan / diturunkan dari style sheet yang lebih general.

 

Pengaturan3.css    :

 

h3

{color: orange;

text-align:left;

 font-size:8pt

}

Multy Style Sheet.html          :

<html>

<head> <title> CSS Multi Style </title>

<link rel=”stylesheet” type=”text/css” href=”Pengaturan3.css”>

<style type=”text/css”>

h3

{   text-align: right;

font-size:20pt         }

</style></head>

<body>

<h3>Heading 3 </h3>

</body> </html>

23 October 2012

CSS

Aturan Penggunaan CSS   Bentuk umum : selector   {property: value} selector (elemen yang akan didefinisikan) property (atribut yang akan diubah) value (nilainya)   Antara property dan […]
23 October 2012

Font HTML

Menggunakan Tag <font> HTML Penggunaan font kemungkinan akan dihilangkan, akan diganti dengan style. <html> <body> <p><font size=”2″ face=”Verdana”> Muhammat Rasid Ridho</font></p>   <p><font size=”7″ face=”Times”> www.emerer.com</font></p> […]
15 October 2012

Tabel HTML

Bentuk umum [crayon-5ada6365d920a581859971/] Elemen elemen tabel <table>…</table> untuk mendefinisi tabel dalam HTML. <caption>…</caption>  untuk judul tabel. <tr>…</tr>  menspesifikasikan baris tabel, atributnya : align( left, center,right)  dan […]
15 October 2012

Image atau Gambar HTML

PENDAHULUAN Untuk menyertakan sebuah image dalam dokumen web: <img src=”NamaImage”> NamaImage adalah URL dari file image tersebut Bisa dalam satu folder, beda forder ataupun dari website. […]
15 October 2012

Form dan Input HTML

Form Dalam satu dokumen dapat terdiri beberapa form, tetapi hanya satu form yang dapat dikirim dalam satu saat. Form tidak dapat berbentuk nested. <form action=”url” method=”get|post” […]
15 October 2012

Frame HTML

Pendahuluan Frame digunakan untuk membangun web page yang memungkinkan penampilan beberapa web page ditampilkan dalam satu window browser.   Sintaks: <frameset border=# {[rows|col]}={#,[#[,..]]} <frame src=”URL” name=”NamaFrame”> […]
15 October 2012

Algoritma Pemilihan

Seringkali suatu intruksi bisa dikerjakan jika ia memenuhi suatu persyaratan tertentu. Komputer tidak lagi mengerjakan secara sekuensial, tetapi berdasarkan syarat yang dipenuhi. Menganalisa Kasus Sebuah persoalan harus […]
15 October 2012

Runtunan di bahasa Pascal

Runtunan adalah struktur algoritma paling dasar yang berisi rangkaian intruksi yang diprosessecara sekuensial, satu per satu, mulai dari intruksi pertama sampai instruksi terakhir. Yang berarti: Tiap […]
4 October 2012

Link HTML

Tag Anchor  <a>   Untuk membuat link kepada dokumen lain dalam web.   Ada 3 jenis: Link Relatif Link Absolut Link dalam Dokumen yang sama.   […]
4 October 2012

List HTML

List Digunakan untukmenguraikan daftar sesuatu, jenis jenis list: List dengan nomor / ordered list List tanpa nomor / unordered list List definisi / definition list   […]
4 October 2012

Format teks HTML

Pemformatan Teks Berikut beberapa pemformatan teks: 1. menebalkan (bold) 2. memiringkan huruf (italic) 3. memberikan tekanan pada teks (emphasize) 4. mengecilkan huruf 5. superscript 6. subscript […]
4 October 2012

Notasi Algoritma

Pseudo-code   Notasi algoritma pseudo-code mempunyai korespondensi dengan notasi bahasa pemrograman sehingga proses penerjemahan dari pseudo-code ke kode program menjadi lebih mudah. Tidak ada aturan baku […]
4 October 2012

Struktur Dasar Algoritma

Pernyataan   Sebuah algoritma merupakan deskripsi langkah-langkah pelaksanaan suatu proses. Setiap langkah di dalam algoritma dinyatakan dalam sebuah pernyataan (statement) atau istilah lainnya instruksi. Sebuah pernyataan […]
4 October 2012

Apakah Algoritma Itu ?

Masalah Menurut Neapolitan (1996) masalah adalah pertanyaan atau tugas yang kita cari jawabannya. Contoh masalah setumpuk kartu pasien di rumah sakit yang tersusun acak, bagaimanamengurutkan kartu […]
24 September 2012

Tag dasar HTML

Pendahuluan World Wide Web / WWW, lebih dikenal dengan web, merupakan salah satu layanan yang didapat oleh pemakai komputer yang terhubung ke internet. Web telah diadopsi […]
27 June 2012

Solusi Fatal error: Call to undefined function session_register() Pada saat membuat Login dengan session

Fatal error: Call to undefined function session_register(). Pernah jumpai error seperti di atas pada saat membuat Login di PHP.Padahal scritp kodenya tak ada masalah jika dijalankan […]
27 June 2012
hosting emerer.com

Hosting Berbayar

Berikut daftar hosting berbayar :   1. Hosting berbayar dari dalam negeri Kunjungi situs Dewa Web   Kunjungi situs Master Web     2. Hosting berbayar dari luar […]
24 June 2012
Mas Rasid

Tentang Rasid

Hai, nama lengkap saya Muhammat Rasid Ridho S.Kom., M.SI Rekan-rekan dan mahasiswa saya biasa memanggil saya dengan pak Rasid. Ada juga yang panggil Mas Rasid, Mas […]
24 June 2012

Script Konfirmasi Delete

…… <html> <head> <title>Lihat Data Siswa</title> …… <!–Membuat Fungsi konfirmasi penghapusan data–> <script language=”javascript”> function konfirmasi(NIS) { tanya=confirm(‘Anda Yakin Data Siswa ‘+NIS+’ ini Di hapus ?’); […]
24 June 2012

Contoh script Menu (index.php)

Untuk membuat aplikasi php pada tampilan pertama atau home di program ini membutuhkan beberapa file php. Yaitu : index.php header.php footer.php dan menu.php   =================================================== Ini […]