Tuesday, 4 June 2013

Tutorial : Cara Membuat Kotak Blockquote

Assalamualaikum...
Whatapps yooo!!!

Okeyh...untuk menghabiskan mase lapang ni..acik nak ajar cara nak buat Blockquote pada blog anda2 semua..Kotak BlockQuote ni bertujuan untuk kita highlight tulisan atau info2 yang korang rase agak penting..atau maybe untuk tonjolkan lagi apa yang korang nak tonjolkan...

Tengok ni..cantikkan kotak blockquote acik..ok!sabar2 jangan gelojoh2...


aduhhh!jom kita belajar macam mane nak tonjol2kan tulisan..eyaahhh!untuk info tambahan..kalau nak buat blockquote,u allz juz highlight tulisan yang ingin ditonjolkan kemudian tekan jer simbol blockquote..


Cara 1 : untuk blogger yang xpernah buat blockquote

1.Login ke Blogspot, clik design/ layout > Edit HTML 
2. Lepas itu, sila cari code di bawah.. gunakan Ctrl F untuk memudahkan pencarian
.post-body {
3. Sila Copy code di bawah dan paste kan di ATAS code .post-body { seperti yang u all cari tadi
.post blockquote { background-image:url(URL GAMBAR BACKGROUND BLOCKQOUTE); -moz-border-radius-topleft: 10px; -moz-border-radius-bottomright: 10px; padding: 6px; Border: 3px solid #FF0080; margin:1em 20px; } 
4. Code yang acik warnakan MERAH, boleh la ditukar mengikut citarasa.
5. 3px adalah ketebalan : lagi banyak nombor lagi tebal, solid boleh diubah kepada dashed atau dotted.
6. URL GAMBAR BACKGROUND BLOCKQOUTE boleh la direplace dengan URL u all
7. Save

Disebabkan acik ni baik hati orangnya..acik sediakan u all background cumil2..juz copy n paste!


http://www.mycutegraphics.com/backgrounds/bpw/bpw38-background.html


http://dl2.glitter-graphics.net/pub/676/676882cl2optzoga.gif
http://dl3.glitter-graphics.net/pub/2534/2534973e8665ew8um.jpg
http://dl2.glitter-graphics.net/pub/2823/2823402tmkg7xaqi2.gif
 # Kalau background yang acik bagi ni xcantik kan..korang p cari sendiri nah kat GLITERR GRAPHIC..
    Selamat mencubaa..





2 comments:

Unknown said...

Tq AcikLiena..Saya guna tutorial awak ye...:)

Acik Liena said...

@Kedai Vitamin orite dear...

 photo left.png  photo right.png  photo pink_heart.png