Tuesday, November 29, 2011

Tutorial : Shadow on the border



Salam semua ^_^

Aku neh, kalo mood nak buat tutorial datang mula lah tergedik-gedik rajin. Bukan apa, bila dapat share sesuatu dengan rakan blogger rasa puas hati sangat sebab at least ada jugak lah sumbangan aku di alam maya neh. heeeheh...

Ok lah, tutorial neh aku nak tunjuk macam mana nak buat shadow dekat border. Tak kesah border dekat kotak post entri ke, kotak post blockquote atau sidebar. Tapi tutorial neh hanya bagi yang ada buat border di kotak entri atau sidebar sahaja. Caranya senang sahaja.

*blurr sekejap, tak tau macam mana nak mula. dah lama tak buat tuto kang*

okeh, gini

1. Dashboard > Design > Edit HTML > tick expand widget templates

2. Untuk border post, cari kod di bawah neh 

.post {

Border sidebar

.sidebar .widget {

Post blockquote

.post blockquote { 

3. Dah jumpa tuh. Cer tengok di bawah kod yang korang cari tuh ada kod untuk border kan? Contohnya, border: 2px solid #FA58F4;

Ok, sekarang korang copy di bawah neh, dan paste di bawah kod border yang tadi tuh. Paham tak?

-moz-box-shadow: 0 0 6px 6px #CED8F6;
-webkit-box-shadow: 0 0 6px 6px #CED8F6;
box-shadow: 0 0 6px 6px #CED8F6;

4. Tulisan pink korang boleh tukar saiz shadow dan warna. Kod warna boleh tengok SINI.

5. Pastu Preview dulu, takde error baru boleh Save. 

6. Kalo korang tak jumpa kod yang aku suruh cari tuh, korang pandai-pandai la eh sebab lain template lain kodnya. Tapi nak buat shadow on the border neh hanya rujuk pada kod border yang telah korang buat sebelum neh. Paham dak ayat keling aku neh? wuwuuu....

Untuk sasape yang nak buat border untuk post entri, sidebar dan post blocquote boleh rujuk tuto neh

> Tutorial: Border sidebar
> Tutorial: Border post entri/ kotak berasingan
> Tutorial: Post blockquote

Next entri, tuto Hover : Link shadow. Contoh, cer klik LINK neh..heheh, tq bebeh. ^_^

adios!
Photobucket

Thanks for your reading love! =D

0 00 orang duk bersembang:

Related Posts Plugin for WordPress, Blogger...