Как сделать в
ТАКИХ табах запоминание после перезагрузки страницы?
<div class="tabs">
<input id="tab1" type="radio" name="tabs" checked>
<label for="tab1" title="Вкладка 1">1</label>
<input id="tab2" type="radio" name="tabs">
<label for="tab2" title="Вкладка 2">2</label>
<input id="tab3" type="radio" name="tabs">
<label for="tab3" title="Вкладка 3">3</label>
<input id="tab4" type="radio" name="tabs">
<label for="tab4" title="Вкладка 4">4</label>
<section id="content1">
<li>
<a href="">1</a>
<a href="">2</a>
</li>
</section>
<section id="content2">
<li>
<a href="">1</a>
<a href="">2</a>
<a href="">3</a>
</li>
</section>
<section id="content3">
<li>
<a href="#">1</a>
</li>
</section>
<section id="content4">
<li>
<a href="#">1</a>
<a href="#">2</a>
</li>
</section>
</div>
CSS:
/* Базовый контейнер табов */
.tabs {}
/* стили секций с содержанием */
section {display: none;}
.tabs input {display: none;}
/* стили вкладок (табов) */
.tabs label {}
/* стили для активной вкладки */
.tabs input:checked + label {}
/* активация секций с помощью переключателя :checked */
#tab1:checked ~ #content1,
#tab2:checked ~ #content2,
#tab3:checked ~ #content3,
#tab4:checked ~ #content4
{display: block;}
Возможно как нибудь реализовать это чисто на CSS? И как вообще можно перелопатить этот код для такой реализации?
