css背景色透明
1. 在css中怎樣讓文字的背景色透明
設置元素的透明度:
-moz-opacity:0.8; /*在Firefox中設置元素透明度
filter: alpha(opacity=80); /*ie使用濾鏡設置透明
但是當我們對一個標簽設置背景的透明度時,往往我們並不希望該標簽上的文字圖片也變成半透明了。
例如:
<div><p>不透明</p></div>
div{-moz-opacity:0.3;filter:alpha(opacity=30);background:#000;width:500px;
height:500px;color:#F30; font-size:32px; font-weight:bold; }
可以很明顯的看出文字也被半透明的,這是我們不想看到的效果。
以前我曾經是絕對定位的方法解決這個問題,也就是現在的p並不是div的子元素。
<div></div>
<p>不透明</p>
這樣div的半透明效果也就不會影響到元素p了。最後在將p定位到需要的位置。
但是很多時候這樣的標簽並不是很合理,有可能還會多浪費幾個標簽。
下面的這種方法就可以解決上面的問題了:
div{background:rgba(0,0,0,0.2) none repeat scroll !important; /*實現FF背景透明,文字不透明*/
background:#000; filter:Alpha(opacity=20);/*實現IE背景透明*/
width:500px; height:500px; color:#F30; font-size:32px; font-weight:bold;}
div p{ position:relative;}/*實現IE文字不透明*/
2. 用css實現div的黑色透明
現在比較穩妥的做法是做一個半透明的黑色PNG圖片,然後把它作為背景,因為單純用CSS來寫回,在IE8及以下版本答裡面是不生效的。當然如果一定要用CSS來實現的話,也容易,可以直接設置這個元素的透明度,例如下面這樣:
background:#000; opacity: 0.8;
也可以直接設置背景色為透明色,例如:
background:rgba(0,0,0,0.8);
這也是樓上的方法,相對而言這個方法還是比較簡潔的,只是會遇到一點點瀏覽器兼容的問題罷了。
3. CSS如何定義DIV背景半透明顏色
「長城郭靖」回答的是錯的,他答的是讓整個元素半透明
只讓背景半透明只有一專個辦法,就是用rgba顏色屬,代碼如下
background:rgba(0,0,0,0.5)
解釋:這是黑色半透明的代碼
前三個值表示顏色的red,green,blue值
最後一個表示alpha值,就是透明度值,不透明為1
(支持IE8+以及所有現代瀏覽器)
還是不懂的話,可以參考 網路 「rgba」詞條 和 「CSS 顏色值」詞條
4. css中,怎麼寫背景圖片的透明度
將一個div設置為絕對定位,在這個div下設置背景圖片與改變圖片透明度。舉例:
html :
...<div id="content"><h1>Hello world!</h1></div> <div id="background"></div>...
css:
#background{ width:100%;height:100%;position:absolute;top:0px;opacity: 0.6;background-image: url(test.jpg);background-size: 500px 500px;}
親測能看到效果。
5. CSS 的顏色代碼 透明色是什麼代碼
透明色:transparent
背景色設為透明,代碼如下:background-color:transparent;
字體版顏色設為透明,代碼如下:color:transparent;
(5)css背景色透明擴展閱讀:
常用權顏色代碼分4種,分別如下:
1、常用顏色單詞,比如green(綠色),yellow(黃色),red(紅色),transparent(透明色)等;
2、以#號開頭的六個字元組成的顏色代碼,比如:#FF0000(紅色),#000000(黑色),#F9F900(黃色)等;
4、rgba(參數1,參數2,參數3,參數4),這種方式前三個參數與上面第3點種相同,第四個參數表示透明度,數值在0-1之間。0表示透明度為0(即透明色),1表示透明度為1(百分百)。
6. HTML如何給背景顏色設置透明度
為div添加樣式。在<title>標簽後面創建一個<style>,在<style>標簽里設置rgba類的高
和背景透明度的樣式(rgba(R,G,B,A))。透明度參數,取值在0~1之間,不可為負值,
透明度參數越小透明度越高。
#test-1,#test-2,#test-3{
width:300px;
height:200px;
line-height:200px;
text-align:center;
display:inline-block;
margin-left:50px;
color:#FFF;
}
#test-1{
background-color:rgba(0,0,0,1);
}
#test-2{
background-color:rgba(0,0,0,0.5);
}
#test-3{
background-color:rgba(0,0,0,0.2);
}
7. DIV 背景色透明,我用CSS代碼: filter:alpha(opacity=50);這樣寫背景是透明了,
<style>
*{ margin:0; padding::0;}
#div1{width:300px; height:200px; position:relative; }
. pos{ background:black; filter:alpha(opacity:30);opacity:0.3; height:100%;position:absolute;width:100%;top:0; z-index:1 }
.box { width:300px; height:20px; background:blue; position:absolute; bottom; top:0;z-index:0; }
</style>
</head>
<body>
<div id="div1">
<div class="pos"></div>
<div class="box">這里是內容部分</div>
</div>
</body>
8. css怎樣僅設置div元素背景透明度,而不設置div元素裡面元素的透明度
設置div元素背景透明度,而不設置div裡面元素透明度的方法:創建靜態頁面插入回一個div和十個子div-類選擇器和元素答選擇器設置div標簽-打開瀏覽器預覽-使用nthoftype設置div元素-保存打開瀏覽器預覽。具體方法如下:
1、在openhbuilderx工具中,創建一個新的靜態頁面並插入一個div和十個子div。
注意事項:
一般來說,我們可以使用CSS的opcity屬性來改變一個元素的透明度,但是它的子元素的透明度也會改變,即子元素被重新定義了。例如:<div style="opacity:0.4; background-image:url(...);"><div style="opacity:1.0;">顯示文字</div></div>文字元素的透明度也會是0.4。
9. css里怎麼給背景圖片變透明點 給圖片的div加什麼代碼才能實現呢
1、新建html文檔,在body標簽中添加一個img標簽,這時默認情況下圖片是不透明的:
10. CSS中背景顏色透明度如何設置
opicaty:50; // 0-100為透明值 100為不透明
不過,ie8及以下不識別,
所以要針對它們再寫一句
filter:alpha(opacity=50);