https://mediawiki.zina.run/index.php?action=history&feed=atom&title=Hugo_Zina_-_Bootstrap_Viewports
Hugo Zina - Bootstrap Viewports - Історія редагувань
2026-10-12T11:10:06Z
Історія редагувань цієї сторінки в вікі
MediaWiki 1.44.2
https://mediawiki.zina.run/index.php?title=Hugo_Zina_-_Bootstrap_Viewports&diff=815&oldid=prev
Romych в 08:59, 3 квітня 2020
2020-04-03T08:59:23Z
<p></p>
<p><b>Нова сторінка</b></p><div>←[[Hugo Zina]]<br />
<br />
Служебные CSS стили, которые включают отображение полоски, показывающей цветом, какой вьюпорт сейчас активен.<br />
<br />
&nbsp; &nbsp; &nbsp;<span style="background-color: red">&nbsp; &nbsp; </span>&nbsp;xs<br />
<br>&nbsp; &nbsp; &nbsp;<span style="background-color: orange">&nbsp; &nbsp; </span>&nbsp;sm<br />
<br>&nbsp; &nbsp; &nbsp;<span style="background-color: yellow">&nbsp; &nbsp; </span>&nbsp;md<br />
<br>&nbsp; &nbsp; &nbsp;<span style="background-color: green">&nbsp; &nbsp; </span>&nbsp;lg<br />
<br>&nbsp; &nbsp; &nbsp;<span style="background-color: blue">&nbsp; &nbsp; </span>&nbsp;xl<br />
<br />
Пример использования:<br />
<br />
<source lang="html"><br />
<div class="vp-brdr"><div><br />
</source><br />
<br />
Файл со стилями:<br />
<br />
assets/sass/utilities/_tech.scss<br />
<br />
<source lang="sass"><br />
// Bootstrap Viewports<br />
.vports-brdr,<br />
.vp-brdr {<br />
@include media-breakpoint-only(xs) { border-top: solid 3px red; }<br />
@include media-breakpoint-only(sm) { border-top: solid 3px orange; }<br />
@include media-breakpoint-only(md) { border-top: solid 3px yellow; }<br />
@include media-breakpoint-only(lg) { border-top: solid 3px green; }<br />
@include media-breakpoint-only(xl) { border-top: solid 3px blue; }<br />
}<br />
</source><br />
<br />
[[Категория:Hugo]]<br />
[[Категория:Bootstrap]]</div>
Romych