Подобие display для текста

396

06 февраля 2017, 17:11

Здравствуйте!

Начал работу над одним проектом и во время разработки у меня возник вопрос. Существует ли стиль на подобии display: none; только для одного текста? Или как вообще можно такое провернуть? Как скрыть только один текст в элементе? Принимаются любые варианты с костылями и без.

Общий код:

.list { 
} 
.list-item { 
  /* text-display: none; */ 
} 
div {display: inline-block; width: 10px; height: 10px; background-color: red;}

<ul class="list"> 
  <li class="list-item">Пункт 0</li> 
  <li class="list-item">Пункт 1<div></div>Продолжение</li> 
  <li class="list-item">Пункт 2</li> 
  <li class="list-item">Пункт 3</li> 
</ul>

Нужно скрыть в пунктах меню один текст.

Answer 1

Использовал font-size:0; таким образом скрыл текст

.list { 
} 
.list-item { 
  /* text-display: none; */ 
  font-size:0; 
  width:200px; 
  height:20px; 
  background:green; 
} 
div {display: inline-block; width: 10px; height: 10px; background-color: red;}

<ul class="list"> 
  <li class="list-item">Пункт 0</li> 
  <li class="list-item">Пункт 1<div></div>Продолжение</li> 
  <li class="list-item">Пункт 2</li> 
  <li class="list-item">Пункт 3</li> 
</ul>

Answer 2