Скрыть метку HTML в CSS - PullRequest
Новая
       1

Скрыть метку HTML в CSS

0 голосов
/ 30 мая 2019

У нас есть интерактивный фильтр на веб-сайте нашей компании, который используется для показа людей по отделам, без необходимости тратить больше денег на разработчика, который имеет доступ к шаблонам, мы можем вносить изменения в CSS с помощью WordPress.

Может скрывать сами фильтры в данный момент, так как они, кажется, содержатся в стиле под названием: # Filters_Department

Ярлык выглядит так, но другие ярлыки на странице мы не хотим скрывать. 

<label>Department:</label>

Это работает для части. 

#filters_department
{
display:none    
}

Пробовал: 

label[for="department"]
{
display:none;
}

Ответы [ 3 ]

2 голосов
/ 30 мая 2019

Я думаю, вам просто нужно добавить атрибут for к вашему ярлыку. 

<label for="department">Department : </label>
0 голосов
/ 30 мая 2019

Этот селектор работает с атрибутами

  • [attribute = "value"] - ищет атрибут, точно совпадающий с "value"
  • [attribute ^ = "value"] - ищет атрибут, который начинается со «значения»

  • [атрибут * = «значение»] - ищет атрибут, который содержит «значение» где-то в нем

    В вашем случаеу вас нет никаких атрибутов.Добавьте class = "..." или id = "..." или пользовательские data-attr = "..."

Если вы используете атрибуты class или id, лучше используйте.value {} или #value {} селектор.

Но обратите внимание, что эти селекторы имеют другое значение, чем селекторы атрибутов, это полезно знать при перезаписи.

См. Пример ниже 

label {
  display: block;
}

label[data-attr="dept-1"] {
  display: none;
}

label[class="someClass"] {
  color: blue;
  font-size: 21px;
}

.someClass {
  color: red;
  font-size: 16px;
}

/* class selector can't overwrite the attribute selector */

#someId {
  color: red;
}

/* id selector can overwrite the attribute and the class selector*/
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <title>CSS</title>
  <script src="script.js"></script>
  <link rel="stylesheet" href="style.css">
</head>

<body>
  <label class="someClass" data-attr="dept-1">Department: 1</label>
  <label class="someClass" data-attr="dept-2">Department: 2</label>
  <label class="someClass" data-attr="dept-3" id="someId" >Department: 3</label>
</body>

</html>
0 голосов
/ 30 мая 2019

Почему бы вам не попробовать добавить класс к метке и настроить его таким образом?

<label class="hidden">Hidden label</label>

.hidden { display: none;}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...