Шаблон страницы ЧАВО

demosourse

Шаблон страницы ЧАВО, который с лёгкостью можно настроить под себя.

Вероятность того, что на вашем сайте понадобится страница “горячих” вопросов и ответов довольно-таки велика. Мы создали готовый шаблон подобной страницы, которую вы с лёгкостью сможете отредактировать под свои нужды.

Основной HTML помещён в секцию .cd-faq. Контент разделён на два основных блока: .cd-faq-categories и .cd-faq-items. В первом поместим навигацию, во втором ответы. Каждый .cd-faq-group — ненумерованный список.

<section class="cd-faq">
	<ul class="cd-faq-categories">
		<li><a href="#basics">Basics</a></li>
		<li><a href="#mobile">Mobile</a></li>
		<li><!-- ... --></li>
	</ul>

	<div class="cd-faq-items">
		<ul id="basics" class="cd-faq-group">
			<li class="cd-faq-title"><h2>Basics</h2></li>
			<li>
				<a class="cd-faq-trigger" href="#0">How do I change my password?</a>
				<div class="cd-faq-content">
					<!-- content here -->
				</div>
			</li>

			<li>
				<a class="cd-faq-trigger" href="#0">How do I sign up?</a>
				<div class="cd-faq-content">
					<!-- content here -->
				</div>
			</li>

			<li><!-- ... --></li>
		</ul>

		<ul id="mobile" class="cd-faq-group">
			<!-- ... -->
		</ul>

		<!-- ... -->
	</div>
</section>

Данный урок подготовлен для вас командой сайта ruseller.com
Источник урока: https://codyhouse.co/gem/css-faq-template/
Перевел: Станислав Протасевич
Урок создан: 1 Марта 2016
Просмотров: 9652
Правила перепечатки


5 последних уроков рубрики "CSS"

^ Наверх ^