Untuk membuat laporan format excel pertama kita buat dulu databasenya
Membuat laporan format excel dengan php
Menampilkan data dari database
`nama` VARCHAR( 30 ) NOT NULL ,
`alamat` VARCHAR( 100 ) NOT NULL ,
`kota` VARCHAR( 50 ) NOT NULL ,
PRIMARY KEY ( `no` )
CSS Link
- a:link – normal, link yang belum dikunjungi (diklik)
- a:visited – link yang sudah dikunjungi (sudah diklik)
- a:hover – kondisi link ketika disorot kursor mouse
- a:active – kondisi ketika link diklik
CSS font
- generic family – grup font family yang terlihat mirip (seperti “Serif” atau “Monospace”)
- font family – font family spesifik (seperti “Times New Roman” atau “Arial”)
Css- praktek1
cssJenis :internal css.
Untuk praktek silakan :
->klik start pada window anda.
->pilih All program
->terus pilih Accossories
->klik menu Notepad lihat gambar berikut
Maka akan terlihat tampilan notepad seperti yang di bawah ini:
anda juga boleh menggunakan text editor apapun, bisa juga pake notepad++
silakan : downloand notepad ++
kemudian ketikan ketikan kode berikut yang terlihat di bawah ini:
Kemuadian save, beri nama prakte1.html,
Cari file yang sudah anda save lalu klik 2 kali file tersebut.
Maka akan terllihat di browser sebagai berikut
untuk mendapatkan scriptnya silakan download di bawah ini
download
CSS - TEXT
a. Text color
properti ini digunakan untuk mengatur warna pada text, properti ini dapat dispesifikasikan berdasarkan:
- nama -nama warna (dlm english), misalnya “red”
- RGB – nilai RGB, misalnya “rgb(255,0,0)”
- Hex – nilai heksa, misalnya “#ff0000″
contoh penggunaan:
body {color:blue;}
h1 {color:#00ff00;}
h2 {color:rgb(255,0,0);}
b. text alignment
properti ini digunakan untuk mengatur posisi text (left, right, center, justify). Contoh penggunaannya:
h1 {text-align:center;}
p.date {text-align:right;}
p.main {text-align:justify;}
c. text decoration
properti ini digunakan untuk memberikan atau menghilangkan dekorasi pada text, misalnya:
a {text-decoration:none;}
kode css di atas akan menghilangkan dekorasi pada link/hyperlink yang biasanya ada (garis bawah). contoh penggunaan text decoration yg lainnya:
h1 {text-decoration:overline;}
h2 {text-decoration:line-through;}
h3 {text-decoration:underline;}
h4 {text-decoration:blink;}
d. text transformation
properti ini digunakan untuk mengatur transformasi text (uppercase, lowercase, dan lainnya). Misalnya:
p.uppercase {text-transform:uppercase;}
p.lowercase {text-transform:lowercase;}
p.capitalize {text-transform:capitalize;}
capitalize digunakan untuk mengubah text menjadi berhuruf besar untuk setiap awal kata.
e. text indentation
properti ini digunakan untuk menentukan jarak pada awal paragraf yang akan dibuat menjorok ke dalam (indentasi). Misalnya:
p {text-indent:50px;}
masih ada lagi properti text yang lainnya, seperti yang tertera pada gambar berikut:
CSS - background
properti CSS untuk background mendefinisikan efek background pada suatu element. properti CSS untuk background yaitu:
• background-color
• background-image
• background-repeat
• background-attachment
• background-position
background color digunakan untuk memberi background warna pada suatu element, misalnya:
body {background-color:#b0c4de;}
yang berarti seluruh halaman web berwarna #b0c4de.
contoh lain misalnya:
h1 {background-color:#6495ed;} element h1 diberi background warna #6495ed.
p {background-color:#e0ffff;} element p diberi warna #e0ffff.
div {background-color:#b0c4de;} element div diberi warna #b0c4de.
selain itu, background color dapat dispesifikasikan berdasarkan:
• nama – nama warna (dlm english), misal “red”
• RGB – nilai RGB, seperti “rgb(255,0,0)”
• Hex – nilai heksa, seperti “#ff0000″
Background Image digunakan untuk menggunakan gambar sebagai background untuk suatu element atau tampilan. secara default gambar yang dimasukkan akan diulang secara vertikal dan horizontal bila tidak ditambahkan property lainnya, contoh penulisannya:
body
{
background-image:url(‘gradient2.png’);
}
bila ingin background berulang secara vertikal saja, horizontal saja, atau tidak berulang bisa digunakan property background repeat, contoh penulisan:
body
{
background-image:url(‘img_tree.png’);
background-repeat:no-repeat;
}
nilai properti background repeat bisa diubah menjadi repeat-x bila gambar ingin diulang secara horizontal atau repeat-y bila gambar ingin diulang secara vertikal.
gambar background juga posisinya bisa diatur dengan property background position, contohnya:
body
{
background-image:url(‘img_tree.png’);
background-repeat:no-repeat;
background-position:right top;
}
pada contoh diatas berarti posisi gambar berada di sebelah kanan atas.
penulisan kode CSS seperti diatas tergolong boros atau “ribet”, supaya tidak ribet dalam CSS ada juga yg dikenal dengan shorthand property yaitu penulisan kode CSS cukup dengan menggunakan urutan nilai property saja sehingga tidak perlu ditulis nama property cukup nilainya saja. metode ini memiliki urutan penulisan, dalam CSS background urutan tersebut yaitu:
background color – background image – background repeat – background attachment – background posistion
contoh penulisannya yaitu:
body {
background:#ffffff url(‘img_tree.png’) no-repeat right top;
}
bila ada property yang tidak digunakan maka dibiarkan kosong saja dan diisi dengan nilai property selanjutnya sesuai urutan.