Themes Redesign (2)

Thursday 2 June 2011
Posted in: IT Anak Rumahan

Masih berkutat di halaman depan. Themes redesign memanfaatkan CSS3 yang hampir didukung sebagian besar browser modern. Adapun teknik yang digunakan adalah border radius, box shadow, text shadow, dan gradient.

Border radius untuk membuat lingkaran melengkung pada box
border-radius
[cc lang=”css”]-moz-border-radius: 10px;
-webkit-border-radius: 10px;[/cc]

Box shadow akan menghasilkan bayangan di kotak navigasi tengah dan running text di bagian bawah
box-shadow
[cc lang=”css”]-moz-box-shadow: 0 0 5px #888;
-webkit-box-shadow: 0 0 5px#888;
box-shadow: 0 0 5px #888;
[/cc]

Text shadow dapat dilihat pada judul blog, membuat bayangan pada teks
hed
[cc lang=”css”]text-shadow: 2px 2px 2px #000;[/cc]

Gradient untuk membuat efek gradient pada latar belakang box
box-gradient
[cc lang=”css”]background: -webkit-gradient(linear, left top, left bottom, from(#C9DAC9), to(#4C9440));
background: -moz-linear-gradient(top, #C9DAC9, #4C9440);[/cc]

Bacaan lebih lanjut bisa kunjungi tautan link berikut

You might also enjoying this post.