CSS「嵌套」如果 - 添加屬性不同的類

我有這樣的選擇：CSS「嵌套」如果 - 添加屬性不同的類

.ui-widget-overlay 
{ 
    background: #262b33; 
    opacity: .70; 
    filter: Alpha(Opacity=70); 
}

我希望有做這樣的事情的能力：

.ui-widget-overlay 
{ 
    background: #262b33; 
    opacity: .70; 
    filter: Alpha(Opacity=70); 

    .container: 
    { 
     -webkit-filter: blur(5px); 
    } 

}

這意味着，如果這選擇器處於活動狀態，將此屬性添加到容器。

這可能嗎？或者我應該採用JS方式？

來源

2014-07-01 Erez Savir

是容器的父母嗎？ –

是的，這是父div div –

我會用jQuery來做這件事。據我所知，之後沒有辦法選擇父母？ http://www.w3schools.com/cssref/css_selectors.asp –

再添加一個類並將其設置爲兩個.container和.ui-widget-overlay - 與JS/jQuery的

.ui-widget-overlay.nowActive { 
    background: #262b33; 
    opacity: .70; 
    filter: Alpha(Opacity=70); 
} 

.container.nowActive { 
    -webkit-filter: blur(5px); 
}

添加/刪除.nowActice時需要它。

在jQuery的是 - .addClass()

來源

2014-07-01 06:54:06 URL87

你可以做這樣的事情。 http://jsfiddle.net/3p3j9/4/

.test1 
{ 
    background:yellow; 
    font-family:Arial; 
} 

.test1 > .test2 
{ 
    background:cyan; 
}

容器將僅適用，如果它是主容器內的設計。

<div class='test1'> 
    test12345 
    <div class='test2'> 
     test123 
    </div> 
</div> 
<div class='test2'> 
    test1234567 
</div>

來源

2014-07-01 07:01:14 Tonned

Demo

您可以使用屬性選擇像

div[class="ui-widget-overlay"] .container {....}

HTML/*例如*/

<div class="ui-widget-overlay">Test 
    <div class="container">Container</div> 
</div>

CSS

.ui-widget-overlay { 
    background: #262b33; 
    opacity: .70; 
    filter: Alpha(Opacity=70); 
} 
div[class="ui-widget-overlay"] .container { 
    -webkit-filter: blur(5px); 
    color: red; /* added to see a visible change */ 
}

來源

2014-07-01 07:03:44 4dgaurav

我的情況是這樣的：http://jsfiddle.net/6ssD3/4/ - 我需要對容器應用模糊。 –

你想應用'-webkit-filter：blur（5px）;'來容器或者測試嗎？ – 4dgaurav

如果應用了ui-widget-overlay，則爲容器。 –

CSS「嵌套」如果 - 添加屬性不同的類

回答

相關問題