Поскольку я не вижу раскрывающегося списка на вашей странице, я даже не понимаю, о чем вы говорите; но даже эта крошечная вырезка пахнет тем, почему первое, что вам нужно сделать, это представить список подробностей о крушении поезда, как НЕ создавать веб-сайт, который является мусором в мусоре, ПРЕКРАТИТЕ тратить свое время на его изучение и ПРЕКРАТИТЕ верить ЛЫСЫМ ЛИЦАМ.
ЛОЖЬ о том, насколько «легко» это делает вещи.
О чем свидетельствуют обломки поездов с такой разметкой:
<header>
<h1>
<a href="/">
FasionFore
<span>-</span>
<small>Fashion Forward</small>
</a>
</h1>
<input type="checkbox" id="toggle_mainMenu" class="toggle" hidden>
<label for="toggle_mainMenu"></label>
<nav id="mainMenu">
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="aboutus.html">About US</a></li>
<li><a href="service.html">Services</a></li>
<li><a href="skill-enhancement.html">Skill Development</a></li>
<li><a href="onlinestore.html">Store</a></li>
<li><a href="contact.html">Contact</a></li>
<li><a href="fashionforeblog.html">Blog</a></li>
</ul>
</nav>
</header>
Код (разметка): выполняет эту работу:
<header class="header"> <!-- Navbar --> <nav class="navbar" role="navigation"> <div class="container"> <!-- Brand and toggle get grouped for better mobile display --> <div class="menu-container"> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".nav-collapse"> <span class="sr-only">Toggle navigation</span> <span class="toggle-icon"></span> </button> <!-- Logo --> <div class="navbar-logo"> <a class="navbar-logo-wrap" href="index.html"> <img class="navbar-logo-img" src="img/logo.png" alt="Модафор"> </a> </div> <!-- End Logo --> </div> <!-- Collect the nav links, forms, and other content for toggling --> <div class="collapse navbar-collapse nav-collapse"> <div class="menu-container"> <ul class="navbar-nav navbar-nav-right"> <!-- Home --> <li class="nav-item"> <a class="nav-item-child" href="index.html"> Home </a> </li> <!-- End Home --> <!-- About --> <li class="nav-item"> <a class="nav-item-child" href="aboutus.html"> About US </a> </li> <!-- End About --> <!-- About --> <li class="nav-item"> <a class="nav-item-child" href="service.html"> Services </a> </li> <!-- End About --> <!-- Skill Enhancement --> <li class="nav-item"> <a class="nav-item-child" href="skill-enhancement.html"> Skill Development </a> </li> <!-- End Skill Enhancement --> <!-- Store --> <li class="nav-item"> <a class="nav-item-child" href="onlinestore.html"> Store </a> </li> <!-- End Store --> <!-- Contact --> <li class="nav-item"> <a class="nav-item-child" href="contact.html"> Contact </a> </li> <!-- End Contact --> <!-- Blog --> <li class="nav-item"> <a class="nav-item-child" href="fashionforeblog.html"> Blog </a> </li> <!-- End Blog --> </ul> </div> </div> <!-- End Navbar Collapse --> </div> </nav> <!-- Navbar --> </header>
Код (разметка): Опять же, просто еще одно доказательство того, что невежды, которые СОЗДАЛИ бутхерню, не имеют права трепаться по поводу написания HTML или CSS, и каждому последнему человеку, ЗАВЕДЕННОМУ этим идиотизмом, вероятно, следует заняться той или иной формой судебного разбирательства.
для возмещения.
Он заставляет вас изрыгать 31 тыс.
разметки на 4,2 тыс.
открытого текста и дюжину изображений контента, даже не 10 тыс.
работы по переворачиванию HTML.
он заставляет вас тратить время на изучение или слепое копирование всех его дурацких презентационных классов в нарушение разума и намерения.
об отделении HTML от CSS, и к тому времени, когда вы получите все их скрипты, выполняющие работу CSS, скрипттардеры, выполняющие работу HTML, бесконечные бессмысленные презентационные классы, бесконечные бессмысленные DIV просто так, сломанный менталитет макетирования и просто полоумный подход к выполнению большого количества задач.
из всего, каждая кодовая база, попираемая этим идиотизмом, превращается в руины, перед которыми любой компетентный человек должен содрогнуться от ужаса.
Они в равной степени сосут нубе и руби своей пропагандистской ложью, и ни одно заявление по этому поводу не выдерживает ни малейшей проверки.
Но скажите мне еще раз, насколько это «проще».
Мой совет? Выбросьте весь этот беспорядок и начните заново, без каких-то дерьмовых рамок.
Тогда вы, возможно, научитесь достаточно, чтобы разрабатывать такие умопомрачительно простые страницы быстрее и проще, и вам не придется бежать за помощью в чем-то столь обыденном, как раскрывающийся список.
Несколько советов? Писать по всей разметке большим количеством классов — это НЕ решение.
Использование DIV со слепо добавленными в него якорями вместо правильной семантики вложенного UL/LI НЕ является решением.