Я хочу использовать Bootstrap для создания гибридного одностраничного приложения (например, Ionic Tabs), у которого есть фиксированные вкладки внизу, динамический заголовок в верхней части и масштабируемое содержимое. Какие атрибуты структуры бутстрапа я могу использовать для достижения этого?Что такое загрузочный способ настройки гибридной страницы (фиксированный заголовок, контент (изменение вида), фиксированный нижний колонтитул)?
-1
A
ответ
0
Попробуйте этот шаблон
http://getbootstrap.com/examples/sticky-footer-navbar/
<nav class="navbar navbar-default navbar-fixed-top" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">Project name</a>
</div>
<div id="navbar" class="collapse navbar-collapse">
<ul class="nav navbar-nav">
<li class="active"><a href="#">Home</a></li>
<li><a href="#about">About</a></li>
<li><a href="#contact">Contact</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">Dropdown <span class="caret"></span></a>
<ul class="dropdown-menu" role="menu">
<li><a href="#">Action</a></li>
<li><a href="#">Another action</a></li>
<li><a href="#">Something else here</a></li>
<li class="divider"></li>
<li class="dropdown-header">Nav header</li>
<li><a href="#">Separated link</a></li>
<li><a href="#">One more separated link</a></li>
</ul>
</li>
</ul>
</div><!--/.nav-collapse -->
</div>
</nav>
<!-- Begin page content -->
<div class="container">
<div class="page-header">
<h1>Sticky footer with fixed navbar</h1>
</div>
<p class="lead">Pin a fixed-height footer to the bottom of the viewport in desktop browsers with this custom HTML and CSS. A fixed navbar has been added with <code>padding-top: 60px;</code> on the <code>body > .container</code>.</p>
<p>Back to <a href="../sticky-footer">the default sticky footer</a> minus the navbar.</p>
</div>
<footer class="footer">
<div class="container">
<p class="text-muted">Place sticky footer content here.</p>
</div>
</footer>
Смежные вопросы
- 1. Основная схема Vaadin: фиксированный заголовок и нижний колонтитул + прокручиваемый контент
- 2. липкий нижний колонтитул и фиксированный заголовок
- 3. Фиксированный верхний колонтитул, фиксированный нижний колонтитул, полноразмерный прокручиваемый столбец столбцов
- 4. CSS фиксированный колонтитул, плавающий заголовок
- 5. Как исправить фиксированный нижний колонтитул jQuery Mobile?
- 6. Фиксированный нижний колонтитул скрывает текст выше
- 7. Программно добавить фиксированный нижний колонтитул в JQueryMobile
- 8. iPad webapp: фиксированный нижний колонтитул и масштабируемый контент
- 9. JQuery Mobile фиксированный нижний колонтитул внутри формы
- 10. Фиксированный фиксированный заголовок
- 11. Удалить фиксированный верхний и нижний колонтитул
- 12. JQuery Mobile Фиксированный заголовок и нижний колонтитул исчезает при прокрутке
- 13. Прокручиваемый стол, фиксированный заголовок фиксированный
- 14. iOS перетащить фиксированный нижний колонтитул, содержащий INPUT
- 15. фиксированный макет + широкий контент = таблицы?
- 16. Абсолютное положение Iframe покрывает фиксированный нижний колонтитул
- 17. Фиксированный нижний колонтитул не показывает весь раздел?
- 18. Как создать фиксированный нижний колонтитул - jquerymobile
- 19. фиксированный верхний и нижний колонтитул, содержание прокручивается
- 20. Bootstrap Фиксированный нижний колонтитул с боковой колонкой
- 21. как исправить нижний колонтитул внизу ширина без использования высоты фиксированный?
- 22. фиксированный нижний колонтитул для печати без полной ширины страницы
- 23. Фиксированный загрузочный бункер-заполнитель
- 24. Фиксированный нижний нижний колонтитул внутри iframe на мобильном приложении
- 25. показать фиксированный нижний нижний колонтитул на прокрутке вверх
- 26. фиксированный верхний и нижний колонтитулы, нижний колонтитул не является 100%
- 27. Фиксированная колонка, содержание жидкости и нижний фиксированный нижний колонтитул
- 28. фиксированный заголовок и поля
- 29. Как создать фиксированный заголовок?
- 30. Фиксированный верхний и нижний колонтитулы не позволяют прокручивать содержимое страницы?