0

私はこのサイトを持っていて、サイドバーに不透明度を追加しようとしていますが、白い部分だけを追加し、他の要素を 100% 不透明にします。

http://eparquitectos.mx/

ここに私のCSSがあります

追加してみました

不透明度:0.4; .sidebar では、テキストやロゴを含め、すべてが同じ不透明度を受け取りました。

SIDEBAR
*************************************************************************/
.sidebar {
margin: 0;
position: fixed;
padding:50px 0 0 0;
width:220px;
height:100%;
left:50px;
top:0;
}

.sidebar.sidebar_absolute{
left:0;
position: absolute;
}

.sidebar.sidebar_absolute .inner_sidebar{
padding-bottom:67px;
}

.inner_sidebar{
width:220px;
float: left;
}

.fullwidth .sidebar{
display:none;
}

.border-transparent{
position: absolute;
width: 1px;
left: 0;
top: 0;
height: 100%;
}

.border-transparent-right{
left:auto;
right:0;
}

div .border-transparent-top{
height:1px;
width:100%;
}


#top .logo, .logo a{
display:block;
position:relative;
border: none;
padding: 0;
margin:0;
float:left;
text-align: center;
}

#top .logo a, #top .logo a:hover{
top:0;
left:0;
outline:none;
border: none;
}

#top .logo img{
border:none;
margin:0 auto;
max-width: 180px;
}

#top .bg-logo, #top .bg-logo a{
text-indent: -9999px;
height:85px;
width:180px;
}


/*menu*/

.main_menu, #top .main_menu .menu{
line-height:30px;
z-index:300;
clear:both;
width:100%;
position: relative;
}

.main_menu div{
position: relative;
width: 100%;
z-index:300;
}

.main_menu .menu, .main_menu .menu ul{
margin:0;
padding:0;
list-style-type:none;
list-style-position:outside;
position:relative;
line-height:50px; 
z-index:5;
}

#top .main_menu .menu a{
display:block;
line-height:18px;
outline:medium none;
padding:9px 0;
text-decoration:none;
z-index: 10;
position: relative;
width:100%;
z-index:5;
}

.main_menu .menu li a strong {
display:block;
font-size:14px;
font-weight:normal;
cursor: pointer;
text-transform: uppercase;
}

.main_menu .menu li a span {
display:block;
font-size:11px;
line-height:14px;
color:#999;
cursor: pointer;
position: relative;
}

お時間をいただきありがとうございます。

4

1 に答える 1

0

rgba() プロパティを調べます。透明度のある背景のような色を指定できます。

不透明度は、子を含む要素全体に影響します。あなたが探しているのは rgba() だと思います

ここに私が持っている本のスニペットの説明があります

アルファ チャネル (略してアルファ) は、要素の透明度の尺度である opacity プロパティとは対照的に、色の透明度の尺度です。そのため、アルファを使用する色の値は、他の色の値と同様に子要素に継承できますが、要素の全体的な不透明度には影響しません。CSS3 では、RGBA カラー モデルの値としてアルファが導入されています。RGBA は Red、Green、Blue、Alpha を表し、構文は CSS2 で使用される RGB 値と同じですが、最後にカンマ区切りの引数を追加して Alpha 値を指定します。{ color: rgba(red, green, blue, alpha); }

于 2013-05-18T01:24:18.477 に答える