Как реализовать средствами CSS скрывание и появление блока с содержимым на странице?

Question

[Pafnut]

Есть блок с содержимым , хочу чтобы по клику на чекбокс этот блок скрывался. Есть еще 2 иконки одна типа плюсик (блок скрыт) и минус (блок показан).

Так думал сделать но не работает почему-то. Подскажите как сделать кнопку когда по нажатию на нее она меняется на другую иконку и показывается и скрывается блок.
Пока повесил на тикер:

HTML:

<input type="checkbox" id="hmt" class="ticker">
<label class="button" for="hmt">
<img src="plus.png" alt=""> //Иконку вставляем в лейбл чекбокса
</label>


CSS:
<code lang="css">
.ticker {         
	display: none;  //Скрываем тикер чекбокса
	&:checked ~ .dopinfo {
		display: none;
	}
}
</code>

Answer 1

[Артём]

Что-то такое?

Comments

[Pafnut]

content: "+"; - не подходит. Мне нужно чтобы по клику бекграунд у дива который в лейбле менялся

Answer 2

[Егор Живагин]

Ты забыл name

<input type="checkbox" id="hmt2" class="ticker" name="hmt">

( У label параметр for ищет input с аналогичным name )