我的完整代码发布在这里Apply Range for Class and ID in CSS
我的 JSfiddle - http://jsfiddle.net/9Tpzp/
我现有的 CSS 代码如下所示
#tab1:target ~ .tabs .tab1 dd div {
height: 28px;
}
#tab2:target ~ .tabs .tab2 dd div {
height: 28px;
}
#tab3:target ~ .tabs .tab3 dd div {
height: 28px;
}
#tab4:target ~ .tabs .tab4 dd div {
height: 28px;
}
我改成如下
[id*='tab']:target ~ .tabs [class*='tab'] dd div {
height : 28px;
}
HTML:
<body>
<div class="container">
<div class="accordion">
<span id="tab1"></span>
<span id="tab2"></span>
<div class="tabs">
<dl class="tab1">
<dd>
<a href="#tab1">Tab #1</a>
<div><p>Tab1</p></div>
</dd>
</dl>
<dl class="tab2">
<dd>
<a href="#tab2">Tab #2</a>
<div>
<p>
Tab2
</p>
</div>
</dd>
</dl>
</div>
</div>
</div>
</body>
现在如何在该正则表达式中指定数字范围 1-4。
如果用CSS实现不了，能否通过jquery等其他方式实现。
最佳答案
使用 jquery 解决了这个问题。下面是修复。
$(document).on('click','a[href^="#tab"]',function(){
$('a[href^="#tab"]').siblings('div').css('height',0);
if($(this).siblings('div').height() == 0){
$(this).siblings('div').css('height',28);
}
else {
$(this).siblings('div').css('height',0);
}
})
关于jquery - CSS 上的正则表达式，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/21542426/