Membuat halaman postingan dan sidebar transparan

Posted: Agustus 26, 2009 in Tutorial

wah sebuah kehoramtan ada yang meminta bantuan kepada saya sahabat ramlan menanyakan bagaimana cara supaya beground postingan bisa tembus pandang.
sebelumnya saya mohon maaf karena pengetahuan masalah blog belum begitu dalam tapi baiklah saya coba mengomentari sahabat ramlan untuk supaya tampilan postingan bisa tembus pandang sahabat semua harus memakai beground di bolg suapay tidak repot membuat beground di blog ada banyak template gratis silahkan sahabat semua memilih disni itu dah langsung tembus pandang namun kalo sahabat membuat sendiri silahkan cari kode outher-wraper seperti di bawah ini :

/* Outer-Wrapper
———————————————– */
#outer-wrapper {
width: 860px;
margin:0 auto;
padding:10px;
text-align:left;
font: $bodyfont;
}

#main-wrapper {
width: 410px;
float: left;
padding: 5px;
border:1px solid $bordercolor;
background-color:#36180a;

word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

#sidebar-wrapper {
width: 200px;
float: right;
padding: 10px;
border:1px solid $bordercolor;
background-color:#36180a;

word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

silahkan sobat cari kode

background-color:#36180a;

kalo dah ketemu silahkan sobat masukan kode di bawah kode di atas:

filter:alpha(opacity=80); -moz-opacity:0.80; opacity:0.80; -khtml-opacity:0.80;

kalo inging halaman postingannya aja hanya di pasang seperti ini yah…

#main-wrapper {
width: 410px;
float: left;
padding: 5px;
border:1px solid $bordercolor;
background-color:#36180a;
filter:alpha(opacity=80); -moz-opacity:0.80; opacity:0.80; -khtml-opacity:0.80;

word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}
Tapi kalo sobat yang transparannya hanya sidebarnya aja silahkan ikuti seperti ini

#sidebar-wrapper {
width: 200px;
float: right;
padding: 10px;
border:1px solid $bordercolor;
background-color:#36180a;
filter:alpha(opacity=80); -moz-opacity:0.80; opacity:0.80; -khtml-opacity:0.80;

word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

kalo ingin keduanya transparan baik itu halaman postingan atau halaman sidebar maka tampilannya seperti ini

#main-wrapper {
width: 410px;
float: left;
padding: 5px;
border:1px solid $bordercolor;
background-color:#36180a;
filter:alpha(opacity=80); -moz-opacity:0.80; opacity:0.80; -khtml-opacity:0.80;

word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

#sidebar-wrapper {
width: 200px;
float: right;
padding: 10px;
border:1px solid $bordercolor;
background-color:#36180a;
filter:alpha(opacity=80); -moz-opacity:0.80; opacity:0.80; -khtml-opacity:0.80;

word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

kalo ada kesalahan saya mohon maaf cuman itu yang bisa saya pahami….
selamat mencoba

Tinggalkan Balasan

Isikan data di bawah atau klik salah satu ikon untuk log in:

Logo WordPress.com

You are commenting using your WordPress.com account. Logout / Ubah )

Gambar Twitter

You are commenting using your Twitter account. Logout / Ubah )

Foto Facebook

You are commenting using your Facebook account. Logout / Ubah )

Foto Google+

You are commenting using your Google+ account. Logout / Ubah )

Connecting to %s