English French German Spain Italian Dutch
Translate Widget by Google

3.1.10

Bikin Border Blog


Oke kawan - kawan, barusan ane belajar merubah-rubah tampilan blog. Buat ane sih biar gak membosankan, karena ane cepat bosan dan cukup capek klo harus ganti template lagi.
Nah, kali ini yang ane pelajari soal border ato garis tepi.

Mungkin para senior dah banyak yang tahu, jadi disini ane sekedar sharing aja. Yukk kita mulai sama-sama :

Ternyata boder itu ada beragam jenis yang bisa kita kreasikan agar tampilan blog lebih berbeda dari biasanya. border ini bisa kita gunakan untuk text atau pun image. berikut beberapa jenis border yang ane ketahui :

Contoh pemakaian pada text :
Kita perhatikan huruf yang berwarna merah.

Kode :
<span style="border: 5px solid rgb(240, 140, 0); padding: 8px;">solid</span>
Tampilan border :


solid


Kode :
<span style="border: 5px double rgb(240, 140, 0); padding: 8px;">double</span>
Tampilan border :


double


Kode :
<span style="border: 5px groove rgb(240, 140, 0); padding: 8px;">groove</span>
Tampilan border :


groove


Kode :
<span style="border: 5px dotted rgb(240, 140, 0); padding: 8px;">dotted</span>
Tampilan border :


dotted


Kode :
<span style="border: 5px dashed rgb(240, 140, 0); padding: 8px;">dashed</span>
Tampilan border :

dashed


Kode :
<span style="border: 5px inset rgb(240, 140, 0); padding: 8px;">inset</span>
Tampilan border :

inset


Kode :
<span style="border: 5px outset rgb(240, 140, 0); padding: 8px;">outset</span>
Tampilan border :

outset


Kode :
<span style="border: 5px ridge rgb(240, 140, 0); padding: 8px;">ridge</span>
Tampilan border :

ridge


Kode :
<span style="border: 5px hidden rgb(240, 140, 0); padding: 8px;">hidden</span>
Tampilan border :

hidden

Catatan : untuk merubah warna ada pada setinggan RGB atau #kode warna
Padding adalah jarak antara obyek dengan border

Jika kita ingin menambah border pada gambar postingan, kita cari kode ini :

.post img

Kemudian kita tambahkan kode border sehingga menjadi seperti ini :

.post img {border: 5px solid #F08C00;}

Nah, setelah kita coba, seperti biasa kita klik previewnya dulu klo dah mantabs baru kita save.
Bookmark and Share


Berita Terkait :

18 komentar:

insanitis37 on 3 Januari 2010 19.56 mengatakan...

menarik sekali mas....
akan saya save ya, karena pasti butuh!!hehe
makasih

Fortuna on 3 Januari 2010 19.59 mengatakan...

makasih tipsnya yg menari ini sob..

moenas on 3 Januari 2010 20.06 mengatakan...

mantabbb brow banyak belajar banyak bisa, sedikit belajar sedikit bisa, kaga belajar kaga bisa2 sippp makin mantab ja neh

Endra on 3 Januari 2010 20.54 mengatakan...

@ all : ane hanya sharing kawan-kawan..

phonank on 4 Januari 2010 10.37 mengatakan...

Wah bikin Mbo'Der yah..??

caelah... lagi sharing nih, hehe..
boleh2...

Aku singkap ilmunya,, sreeeppp... hehe

phonank on 4 Januari 2010 10.38 mengatakan...

Foto pejabat di rumah phonank,, name tag nya udah diganti doonk... jadi nama Phonank,, wakakakak...
Melihat saja kekurangan dari foto ku, hehe sipp...

Thanks..

Endra on 4 Januari 2010 10.41 mengatakan...

phonank : weits.. ane ndak sengaja itu brow.. wakakakakkk..

phonank on 4 Januari 2010 11.04 mengatakan...

haha...
bukan salah dikau..
emang phonank yang kurang teliti,, name tag nya baru phonank edit lagi tadi, hehehehe

jd foto yg tadi dilihat emang salah nama,, hohohoo

Tenang saja gak bakal diputus kok aliran listriknya,,, cuma di cabut ajah dari peredaran, heehehe

Just Kidding... hohoo

Rizky2009 on 4 Januari 2010 11.56 mengatakan...

wah mantab nih sob kapan coba, soalnya css q terlalu rapet akibat tak kompres

www.blogsportainment.blogspot.com on 13 Januari 2010 11.28 mengatakan...

makasih triknya..

megi on 21 Februari 2010 14.26 mengatakan...

info yg bermanfaat,
salam kenal

audio conference on 25 Februari 2010 10.16 mengatakan...

nice infonya sob, salam kenal dari q & jgn lupa mampir juga ya

Place to modify blog on 6 Juli 2010 21.04 mengatakan...

hehehehehehe keren tutorialnya,, oy mas, salam kenal, kunjungan pertama. cuma mau share mas, di w3school ada tutorialnya, cuma pake bahasa inggris. bisa juga belajar css, html, xml, javascript, php d.l.l. bisa baca di sini http://modifblogmu.blogspot.com/2010/06/yuk-belajar-html-xml-css-php-my-sql.html .. tp, mungkin mas dah tahu ini, ane cuma share aja. mana tau belum tahu tentang ini..

temennya temenmu on 1 Oktober 2010 16.34 mengatakan...

kepala pusing bikin pening, jalan-jalan ah nyari baclink :)

junior on 23 Maret 2011 18.49 mengatakan...

menarik sob.. lumayan buat utak-atik blog ane

sherlina on 11 Maret 2015 22.32 mengatakan...

www.indobet77.com

Master Agen Bola , Casino , Tangkas , Togel Terbesar
dan Terpercaya Pilihan Para Bettor

Promo Terbaru :
- Bonus  10% New Member Sportsbook
- Bonus 5% New Member Casino Online
- Bonus 10% Setiap Hari Bola Tangkas
- CASHBACK untuk Member
- BONUS REFERRAL 5% + 1% Seumur Hidup

untuk Informasi lebih jelasnya silahkan hubungi CS kami :
- YM : indobet77_sb2@yahoo.com
- EMAIL : indobet77@gmail.com
- WHATSAPP : +63 905 213 7238
- WECHAT : indobet77
- SMS CENTER : +63 905 213 7238
- PIN BB : 2B65A547 / 24CC5D0F

Salam Admin ,
http://indobet77.com/

sherlina halim on 17 Juni 2015 17.48 mengatakan...

Pengen yang lebih seru ...
Ayo kunjungi www.asianbet77.com
Buktikan sendiri ..

Real Play = Real Money

- Bonus Promo Red Card pertandingan manapun .
- Bonus Mixparlay .
- Bonus Tangkasnet setiap hari .
- New Produk Sabung Ayam ( minimal bet sangat ringan ) .
- Referal 5 + 1 % ( seumur hidup ) .
- Cash Back up to 10 % .
- Bonus Royalty Rewards setiap bulan .

untuk Informasi lebih jelasnya silahkan hubungi CS kami :
- YM : op1_asianbet77@yahoo.com
- EMAIL : asianbet77@yahoo.com
- WHATSAPP : +63 905 213 7234
- WECHAT : asianbet_77
- SMS CENTER : +63 905 209 8162
- PIN BB : 2B4BB06A / 28339A41

Salam Admin ,
http://asianbet77.com/

Poker Online on 21 Desember 2015 09.45 mengatakan...

Sumber berita yang bagus dan bermanfaat gan... Lanjutkan yang lebih bagus lagi gan..

Agen Poker
Agen Poker Online
Agen Poker Terpercaya
Poker Online
Poker Terpercaya
Bandar Domino
Bandar Domino Online
Agen Domino
Judi Poker
Taruhan Poker
Bandar Poker

Posting Komentar

Ini adalah blog doFollow, mohon PENGERTIANNYA ya..
Klo ada salah, mohon diingatkan.. makasih dah berbagi

 
TOP Commentator
Comment Terbaru
TUKERAN LiNK

Lebih Cepat pake | Mozilla Firefox