Скрыть элемент HTML с помощью CSS, если в нем есть определенный текст?

Трудно манипулировать сайтами, если у них нет собственного класса для каждого элемента.

Например, как я могу скрыть второй элемент из этого кода ниже?

<p>
    <p>te</p>
    <p>st</p>
    <p>ing</p>
</p>

Текст никогда не меняется внутри элемента.

Я использую Стильный с Firefox для редактирования CSS / HTML для веб-сайтов.

html css stylish

— Новобранец
источник

При каких условиях он должен быть скрыт? Я предполагаю, что вы хотите скрыть это программно

— CLockeWork

Он должен быть скрыт, если внутри HTML-элемента есть текст "st", а второй - там. Я не знаю лучшего способа сказать, какой элемент скрыть, разве что у CSS есть возможность указать на n-й элемент?

— Новичок

У CSS действительно есть такая особенность: w3schools.com/cssref/sel_nth-child.asp

— CLockeWork

Я не знаю, как использовать логику (определить значение в теге и сделать что-то конкретное), используя только CSS и HTML, для этого вам понадобится Javascript или какой-то другой. Но если вы хотите скрыть второй элемент p в текстовом блоке, вы можете сделать это с помощью CSS-селектора n-го типа:

Оберните ваши p-теги в div и присвойте div класс.

<div class="HideChild">
    <p>te</p>
    <p>st</p>
    <p>ing</p>
</div>

Затем в вашем CSS создайте селектор вот так:

.HideChild p:nth-of-type(2)
{
display: none;
}

Обертывание тегов p в div и использование класса означает, что вы можете повторно использовать эту функцию для нескольких текстовых блоков на вашей странице. Если вы хотите изменить , какая строка скрыта изменить номер после п-го ребенка, и если вы хотите страницу , чтобы показать разрыв , где линия должна заменить display: noneс visibility: hidden.

— CLockeWork
источник

Кажется, работает, но он не считает, какой это тип элемента, скажем, внутри класса HideChild есть несколько ссылок, и некоторые теги <p>, которые я хочу скрыть. затем, когда количество ссылок изменяется, функция nth-child больше не знает, какой элемент скрыть.

— Новичок

Другой вариант - перебрать их и использовать jquery$(this).contains("");

— nerdwaller

Хороший вопрос @ Rookie, обновил мой ответ, чтобы использовать вместо этого селектор nth-of-type

— CLockeWork

Работает теперь без нареканий! Где вы найдете все эти возможности CSS? Есть ли сайт со списком всех команд CSS, и я мог бы изучить их одну за другой?

— Новичок

@nerdwaller, возможно ли использовать JS со Стильным?

— Новичок