CSS選擇器定位有序列表
[英]CSS selector targeting ordered list
問題描述
我正在嘗試從以下標記中定位ol.sc-tracklist
<ul id="sc-track-list">
<li class="sc-track format-audio">
<div class="sc-player">
<ol class="sc-artwork-list">
<li class="sc-time-indicators">
<span class="sc-position">0.00</span>
¦
<span class="sc-duration">2.38</span>
</li>
<li class="sc-controls">
<a class="sc-play" href="#play">4</a>
<a class="sc-pause" href="#pause">5</a>
</li>
<li class="sc-track-artwork active">
<div class="sc-no-artwork">
</li>
</ol>
<ol class="sc-trackslist">
<li class="sc-info">
<h3 class="sc-track-title">
<a href="http://soundcloud.com/jillian02/gently">Gently</a>
<a class="sc-info-toggle button" href="#info">
more
<span class="icon">i</span>
</a>
</h3>
<div class="sc-more-info">
<h4>
by
<a href="http://soundcloud.com/jillian02">Jill Owen</a>
</h4>
<p class="remove-bottom">solo piano music</p>
</div>
<footer></footer>
</li>
<li class="active">
<span class="sc-track-state"></span>
<a href="http://soundcloud.com/jillian02/gently">Gently</a>
<a href="null">
<span>Buy</span>
<span class="icon">}</span>
</a>
</li>
</ol>
</div>
<div class="meta">
<p>
<a class="spch-bub-inside" href="#">
<span class="point"></span>
<em>23</em>
</a>
</p>
</div>
</li>
</ul>
我嘗試過
.sc-track.format-audio .sc-player .sc-tracklist
和
.sc-track.format-audio div.sc-player ol.sc-tracklist
但是沒有喜悅。
內容是從jquery json響應動態生成的，我想知道它是否有影響。
有任何想法嗎？ 非常感謝
2 個解決方案
解決方案1
0 已采納 2012-01-07 19:11:15
您的html格式不正確。 移動這個：
<div class="meta">
在<li></li> 。
或者，如果它應該在那里，請將其關閉：
<div class="meta"></div>
同樣， <ol>元素也應該關閉。
編輯：這對我有效（請參見此處操作）：
CSS：
li.sc-track.format-audio ol.sc-trackslist {
font-size: 100px;
}
HTML：
<html>
<head>
</head>
<body>
<li class="sc-track format-audio">
<div class="sc-player">
<ol class="sc-artwork-list"></ol>
<ol class="sc-trackslist">
<li>SC TRACKLIST</li>
</ol>
</div>
<div class="meta"></div>
</li>
</body>
</html>
解決方案2
0 2012-01-07 19:28:05
首先修改並確保您的HTML符合W3C。
對於li標簽，將類指定為sc-track format-audio
要定位特定標簽，您可以直接使用該標簽ID或類名進行定位。
例：
.sc-trackslist
要么
.format-audio .sc-trackslist
要么
.sc-track .sc-trackslist
在某些情況下，您需要定位如下：
#parentID .2ndChildClass .1stChildClass
使用css選擇器定位html標簽文本
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.