Seperti apa yang pernah saya bahas pada postingan saya tentang cara memilih template blog, saya pernah menjelaskan bahwa memanipulasi tampilan Rounded corner dengan CSS lebih baik daripada menggunakan image/gambar. Meskipun antara CSS dan image memiliki kelebihan tersendiri. Setidaknya jika anda menggunakan CSS maka akan sedikit lebih cepat dibanding image. Contoh dalam membuat rounded corner bisa anda lihat di bawah ini.
Perhatikan sudut kolom ini.
Kolom di atas di bentuk dari kode ini.
<div style="width:250px;
-moz-border-radius-topleft:15px; -moz-border-radius-topright:15px; -moz-border-radius-bottomleft:15px; -moz-border-radius-bottomright:15px; -webkit-border-top-left-radius:15px;
-webkit-border-top-right-radius:15px;
-webkit-border-bottom-left-radius:15px;
-webkit-border-bottom-right-radius:15px; margin:0; padding:10px; background:#eee; border:1px solid #ccc; height:75px;"> ISI CONTENT </div>
Keterangan:
Berikut ini contoh penerapan rounded corner pada navigasi/menu blog.
/*-- Misalkan kode navigasi/menu anda seperti ini --*/
#Nav {
width: 900px;
-moz-border-radius-topleft:15px;
-moz-border-radius-topright:15px;
-moz-border-radius-bottomleft:15px;
-moz-border-radius-bottomright:15px;
-webkit-border-top-left-radius:15px;
-webkit-border-top-right-radius:15px;
-webkit-border-bottom-left-radius:15px;
-webkit-border-bottom-right-radius:15px;
height: 34px;
margin: 0px auto;
position:relative;
top: 14px;
text-align: center;
line-height: normal;
}
Untuk lebih jelasnya, silakan anda baca DI SINI. Semoga bermanfaat...
20 Comments:
Wahhh... keren nich...
Aku simpan dulu sob...
wah sobat pasti jago dreamweaver nya
ini memang harus di save,,baru aku liat tutorialnya
mantap nih, jadi melengkung bordernya...keren Mas tutorialnya
untuk virus yang menghilangkan mp3 biasanya penyusupannya di cmd atau comandprompt bisa jadi dari file mp3 itu sendiri..saya sudah banyak up load anti virus sabar ya sob nanti juga beredar dan cara buat virusnya nanti juga ada sekarang lagi fokus assembly..biasa lagi ngumpulin point sob...
terima kasih sudah mampir,,aku sebenarnya sudah follow blog ini
berkunjung mencari info terbaru
terima kasih
Sip.
Save dulu ya
@Rock, hehe,,, selalu terdepan mas, kaya jupiter,wkwkwk
@Ph-Pnternet, g juga mas, saya cuman seneng aja otak-atik template. iya mas ditunggu updatenya.
@Hendro-Prayitno, silakan mas,,,
@Regi_Adi, makasih mas...
@Imtikhan, sama-sama mas...
@Tomo, wah cepet banget nyampe sini, saya aja baru pulang dari rumah mas...
harus saya kopi nih, buat bikin template baru :)
Good info n triknya..kayak jalanan,bisa nikung ^_^...
Lam Kenal Sahabat..
Kunjungan balik mas,tengkyu postingnya
Wah sipp mas,kebetulan aku mau edit menu nav ku biar kayak blog yg Ini
@Secara teh dan sekerat roti, silakan dicopy mas,,,
@Blog Sehat, sama-sama mas, salam kenal balik,,,
@Hendarblog, sama-sama mas, makasih juga kunjungan baliknya...
@Mansuka, selamat mencoba aja mas...hehe...
bagi saya sangat-sangat bermanfaat sekaLi sob untuk kaLi ini, kebetuLan saya sedang terkendaLa dengan haL tersebut.
-----------------
o ya, kaLo Link/banner bLog ini beLum terpasang di bLog saya, mohon di ingatkan. karena terLaLu banyaknya saya tidak bisa nge-cek satu-persatu, juga bermanfat bagi saya untuk sering-sering mampir ke bLog ini. terima kasih sob.
------------
kaLo Lagi upacara jangan suka ngumpet Lagi yah. hehehehe.....
kunjung kembaLi untuk membaca tuLisan Lainnya yang dapat bermanfaat bagi saya sebagai orang awam di bidang teknoLogi. saLam persahabatan, seLamat istirahat.
tapi aneh kalau di template blog saya nie kalau di buat radius 15 jadi acak acakan kalau 10 ke bawah masih bagus....
nice info bung. . . Comment balik ya. . .thx
@Om_rame, alhamdulillah udah dapet obatnya, :D, sekarang kan udah g skulah om, saya juga orang awam kog om masalah beginian, cuma sekedar ngerti aja,,,
@Gudang Ilmu, iya mas diganti aja, kalo kode di ataskan cuman buat contoh biar jelas aja lengkungnya...
@Arie, siaaap, segera ke TKP
kunjungan balik bro... trims yah infonya. sekarang tinggal nyobain nih border yang pojoknya melengkung hehehehe :D
Gan, kalo bikin pake image tau caranya g? soalnya klo CSS3 g cross browser, IE terbaru aja msh lambat banget jadinya, padahal cuma scrolldown doang..
Blog ini "DOFOLLOW", Silakan tinggalkan komentar anda, bebas tapi sopan. Tidak kami anjurkan untuk mencantumkan link pada komentar serta memakai nama Anonymous.
Komentar yang bernada SPAM atau SARA akan kami hapus.
Post a Comment