2013-03-07 7 views
2

У меня есть следующий HTML структуру:Css селекторы SharePoint 2010

<div class="ms-PostFooter"> 

<span style=""> 
<span style="" class="s4-clust"> 
<a href="#" style=""> 
<img src="" alt="" style="l" title="" class="imglink" longDesc="" /> 
</a> 
</span> 
</span> 

<span style=""> 
<span class="s4-clust"> 
<a href="#" style=""> 
<img src="" alt="" style="" title="" class="imglink" longDesc="" /> 
</a> 
</span> 
</span> 

<span style=""> 
<span class="s4-clust"> 
<a href="#" style=""> 
<img src="" alt="" style="" title="Number of Comments" class="imglink" longDesc="" /> 
</a> 
</span> 
</span> 

</div> 

В CSS, как бы я выбрал третий тег для того, чтобы скрыть изображение с названием «Количество комментариев»?

+0

применить класс, который имеет свойство 'display: none' для вашего тега img – Sachin

+0

Я бы сделал это, но я не хочу идти и редактировать HTML ...., который включал бы внесение изменений в проект брендинга, а затем развертывание, которое быть overkill в этом случае ... –

ответ

1
.ms-PostFooter span::nth-child(3) img { 
    display: none; 
} 

или это также работает:

img[title="Number of Comments"] { 
    display: none; 
} 

однако они полагаются на вашей разметки/контента. лучший способ будет - генерировать определенный класс по этому изображению или его контейнера, на стороне сервера (если вы можете)

+0

Привет, Luca, селектор img выше работал, однако я заметил, что ссылка все еще существует, хотя изображение теперь скрыто. Как бы я спрятал весь третий тег ? –

+0

Третий бит CSS в моем ответе выше должен сделать трюк. – jmshapland

+0

@ DanielPerez, если вы удалите 'img' из первого варианта в моем ответе, он скроет весь третий' 'тег :) – Luca

0

Одним из возможных вариантов, если ваш заголовок является уникальным:

[title="Number of Comments"] 
{ 
    display:none; 
} 
0

Вы можете использовать следующее:

div :last-child span .imglink{ 
    display:none; 
} 

jsfiddle: http://jsfiddle.net/kGThS/1/

Это может быть более конкретным:

.ms-PostFooter :last-child span .imglink{ 
    display:none; 
} 

jsfiddle: http://jsfiddle.net/kGThS/3/

Чтобы скрыть всю последнюю поверочную/ссылку, как на ваш комментарий ниже используйте следующее:

.ms-PostFooter :last-child span{ 
    display:none; 
} 
0

Как-то через CSS SharePoint не позволяет мне использовать любого из селекторов упомянутых здесь через css, чтобы избавиться от конкретного тега, содержащего ссылку и изображение, которое нужно удалить, поэтому я решил использовать jquery вместо этого, который сделал трюк следующим образом:

$(document).ready(function() { 
$('DIV.ms-PostFooter span:nth-child(3)').css('display', 'none'); 
$('DIV.ms-PostFooter span:nth-child(4)').css('display', 'none'); 

}); 

Спасибо за помощь.