CSS的挑戰：只顯示頁面上的元素的一個實例

Question

我試圖顯示一個列表中的相關職位的位置，我已經插入列表作爲簡碼，但隱藏自動插入列表的位置我的相關帖子插件（MicroKids）。我已經爲短代碼生成列表分配了一個類;我無法對自動插入的列表進行任何更改。

例如，在http://www.litquake.org/calendar-of-events/the-future-that-never-was上，您會看到地圖上顯示的作者姓名（以Murray，Tina Marie開頭）（我想要顯示的插入簡碼的列表）以及重複列表作者名稱顯示在地圖下方（我想要隱藏的自動插入列表）。

下面的代碼的簡化版本：

<div class="entry-content clearfix"> 
<p> 
<div class="show-related-posts" style="padding-left: 30px;"> 
<div class="related-posts"> 
</div> 
<div id="em-location-map-ca500" class="em-location-map" style="background: none repeat scroll 0% 0% rgb(205, 205, 205); width: 400px; height: 300px; position: relative; overflow: hidden;"> 
<div id="em-location-map-info-ca500" class="em-location-map-info" style="display:none; visibility:hidden;"> </div> 
<div id="em-location-map-coords-ca500" class="em-location-map-coords" style="display:none; visibility:hidden;"> 
<div class="related-posts"> 
<div id="related-posts-MRP_all" class="related-posts-type"> 
</div> 

有誰知道我怎麼可以針對列表中的一個發生而不是其他？

Answer 1

你有兩個選擇：

1. 要麼你給他們喜歡class="related-posts related-posts-1"一個附加的類，然後使用這個類選擇它。

2. 或者您可以使用.related-posts:first-child或.related-posts:last-child作爲選擇器。