css里的
#tab1:target ~ .tabs li a[href="#tab1"], #tab2:target ~ .tabs a[href="#tab2"], #tab3:target ~ .tabs a[href="#tab3"] {
border-bottom-color:#fff;
}
“#tab1:target ~ .tabs li a[href="#tab1"]”这个是什么意思?CSShtml
#tab1:target ~ .tabs li a[href="#tab1"], #tab2:target ~ .tabs a[href="#tab2"], #tab3:target ~ .tabs a[href="#tab3"] {
border-bottom-color:#fff;
}
“#tab1:target ~ .tabs li a[href="#tab1"]”这个是什么意思?CSShtml
解决方案 »
- getJson(),回调函数不执行。
- Jquery问题
- jquery根据class来选取对应的<input>
- 小弟有两个问题还不明白,请各位大虾帮忙解答下,谢谢
- Extjs框架下父页面与子页面相互操作问题
- webmenushop自动生成的JS文件要怎么解密啊???
- 梅花雪树的问题,请教了!!!
- 关于一个批量仿select的jquery代码
- window.createPopup() 打开的窗口位置,总是以屏幕像素定位,如何以客户端 像素定位????
- 一个很奇怪的问题--关于html实现表单提交
- 如何让img的src由JAVASCRIPT取得
- 关于extJs中dateField控件有没有数据回显功能
2.'~'参考:http://mozilla.com.cn/post/21668/。
表示:
所有className为"tabs"下的[<li>标签]下的[<a href="#tab1">标签].
而前面
#tab1:target~xxxxxxx
表示
id为tab1的, target属性符合xxxxxx条件的东西. 所以lz结合起来分析一下..
tabs 要放在下面的。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<style>
#tab1:target ~ .tabs li a[href="#tab1"],#tab2:target ~ .tabs a[href="#tab2"],#tab3:target
~ .tabs a[href="#tab3"] {
background-color: #432;
}
</style>
</head>
<body>
<div id="tab1" class="tab_content">
tabs1
</div>
<div id="tab2" class="tab_content">
tabs2
</div>
<div id="tab3" class="tab_content">
tabs3
</div>
<ul class="tabs">
<li><a href="#tab1">标签一</a></li>
<li><a href="#tab2">标签二</a></li>
<li><a href="#tab3">标签三</a></li>
</ul>
</body>
</html>
#tab1在相应target伪事件时, xxxxxx执行{style}例如:
#tab1:target ~ .tabs li a[href="#tab1"]换为
#tab1:target ~ .tabs li a[href="#tab2"]表示在#tab1:target~(被点击时), .tabs li a[href="#tab2"]的<a>标签执行下述样式
我用的FF22和ie10,还是看不到效果,你在本地试过么?
点<li><a href="#tab1">标签一</a></li>
<li><a href="#tab2">标签二</a></li>
<li><a href="#tab3">标签三</a></li>
https://developer.mozilla.org/en-US/docs/Web/CSS/:target