1. Latar Belakang
CSS merupakan rekomendasi untuk para web design untuk mengatur tampilan dari halaman , isi, menu dll. contoh untuk mengatur warna, tampilan , ukuran dll.
2. Tujuan
Mengatur Text,Font,gambar menggunakan CSS
3. Pembahasan
1. Membuat warna pada teks yang ber-link
2. Mengatur gaya tertentu pada bagian dari elemen (teks baris
pertama,huruf pertama baris pertama
3. Mengatur Transparansi pada gambar / picture
1. Membuat warna pada link
Link merupakan kata atau tulisan yang jika di klik akan menimbulkan atau membuat kita berpindah pada halatman lain. link dapat kita sambungkan pada teks,gambar atau simbol. perintah untuk mengawali membuat link menggunakan <a href> dan mengakhirinya dengan perintah </a>. dan di CSS ini kita akan merubah atau mengatur warna pada teks yang ber-link dengan perintah. yang berada pada daerah <style> dan </style> kita dapat memasukan perintahnya.
- Untuk mengatur warna teks ber-link tampilan awal menggunakan
a:visited {
color: "......";
}
- Untuk mengatur warna teks ber-link pada saat mouse mendekatii teks menggunakan
a:hover {
color: "......";
}
- Untuk mengatur warna teks ber-link pada saat di-klik pada teks menggunakan
Contoh :a:active {
color: "......";
}
- sintaxs <style> dan </style> merupakan tempat atau bagian yang digunakan saat kita akan memasukan perintah - perintah untuk mengatur style atau desain.
- a : visited , a:hover , a : active merupakan perintah yang digunakan untuk :
- Untuk mengatur warna teks ber-link pada saat mouse mendekatii teks
menggunakan
- Untuk mengatur warna teks ber-link pada saat di-klik pada teks
menggunakan
- Color : merupakan perintah yang digunakan untuk mengatur warna
 |
| Hasil |
ada beberapa hasil :
1. Tampilan awal berwarna biru
2. Saat cursor mendekati teks berwarna pink
3. Saat di-klik teks akan berwarna hijau.
2. Mengatur gaya tertentu pada bagian dari elemen (teks baris
pertama,huruf pertama baris pertama.
Perintah - perintah tersebut juga teman - teman masukan pada bagian
diantara <style> dan </style>.
- Untuk mengatur teks baris pertama menggunakan perintah
p::first-line {
color: "......";
font-variant: small-caps;
}
- Untuk mengatur huruf pertama pada teks baris pertama
Contoh :p.intro::first-letter {
color: "......";
font-size:200%;
}
- Mengatur teks baris pertama
 |
| Script |
 |
| Hasil |
- Mengatur huruf pertama pada teks baris pertama
 |
| Script |
 |
| Hasil |
Gambar pada web atau halaman blog memiliki arti atau bagian yang cukup penting karena gambar bisa mewakili dari keseluruhan atau sebagian halaman.
untuk menambah ketertarikan dari pembaca atau pengunjung gambar juga harus diberi style atau pengaturan yang mem-perindah tampilannya. saat ini saya akan berbagi tentang gambar yang diberi opacity atau transparasi.
- Untuk mengatur blur atau opacity pada gambar sebelum kursor berada pada gambar menggunakan perintah .
- img, merupakan variabel atau nama bagian yang akan diatur.
- opacity, pengaturan yang digunakan untuk mengatur blur , semakin
rendah ukurannya maka akan semakin blur .
- filter ,pengaturan yang digunakan untuk memberikan kesan blur pada
tampilan awal pada gambar.
- img, merupakan variabel atau nama bagian yang akan diatur.
- opacity, pengaturan yang digunakan untuk mengatur blur , semakin
rendah ukurannya maka akan semakin blur begitu sebaliknya semakin
tinggi ukurannya maka akan semakin jelas efeknya.
- filter ,pengaturan yang digunakan untuk memberikan kesan blur pada
tampilan awal pada gambar.
- hover, efek yang timbul akibat kursor.
4. Kesimpulan
Kesimpulannya adalah di CSS kita dapat mengatur efek dari teks,gambar dengan mengatur warna,opacity( transparasi ),style font dll. sesuai dengan kebutuhan untuk memperindah tampilan.
5. Referensi
- http://www.w3schools.com/css/css_pseudo_classes.asp
- http://www.w3schools.com/css/css_pseudo_elements.asp
- http://www.w3schools.com/css/css_image_transparency.asp
EmoticonEmoticon