CSS3交替錶行不透明度影響文本以及背景

我想要拿出一些CSS來匹配我在我的iPhone/Android應用程序中的樣式。我有不透明的交替行顏色，所以我的自定義頁面背景流血。但是，我遇到的問題是我不希望表單元格中的文本也不透明。我希望文本的透明度爲1.0，背景爲不透明度= 0.12。看到它現在看起來像here。下面CSS3交替錶行不透明度影響文本以及背景

CSS：

html { 
    -webkit-background-size: cover; 
    -moz-background-size: cover; 
    -o-background-size: cover; 
    background-size: cover; 
    height: 100%; 
    background-image: url(../images/[email protected]); 
} 
table { 
    background-color: transparent; 
    margin-left: 0px; 
    margin-right: 0px; 
    margin-top: 10; 
    height: 100%; 
    width: 100%; 
    border: 0; 
    border-collapse: collapse; 
} 
tr { 
    text-align: center; 
    padding: 0; 
} 
td { 
    font-family: verdana; 
    color: #ffffff; 
    text-shadow: 1px 1px 1px #77777777, 2px 2px 7px #ff0000; 
    padding: 0; 
} 
tr:nth-child(odd) { background-color:#003366; opacity:.12; filter:alpha(12); } 
tr:nth-child(even)  { background-color:#6a737d; opacity:.12; filter:alpha(12); }

來源

2011-11-22 LiteWait

您可以使用rgba的顏色作爲背景。 opacity會影響孩子的元素，並沒有太多的事情要做。

來源

2011-11-22 15:18:03 Tetaxa

是的，工作。謝謝。 – LiteWait

使用rbga背景色（CSS3）並在其中設置不透明度。 background-color = rgba（255,255,255,0.12）;

使用正常不透明度影響因素的孩子，所以文只是得到了父母的不透明度，在這種情況下是100％0.12

來源

2011-11-22 15:18:56 Helen

是的，工作。謝謝。 – LiteWait

正確但錯誤地引向讀者。這不是它的繼承（作爲繼承可以被重寫）。它的事實是，你做出透明的東西，因此任何東西都將具有透明度。如果你讓父母50％透明，孩子仍然100％可見。如果你讓孩子透明度達到50％，你就可以讓75％的孩子透明（50％的人達到50％）。關於主要文件的透明度 – Lee

感謝您的意見 - 修改了措辭，試圖使其更清晰。 – Helen

你也可以嘗試把子元素在父面前元素使其不受父母不透明度的影響。

父：z-index:10 爲孩子：z-index:11

來源

2011-11-22 15:53:39 huroran

CSS3交替錶行不透明度影響文本以及背景

回答

相關問題