„Snið:Bootstrap-mynd“: Munur á milli breytinga

Núverandi breyting frá og með 5. mars 2025 kl. 18:53

Þetta snið má nota til að móta mynd þannig að hún skalist í takt við stærð vafragluggans eftir Bootstrap verkfærasettinu.

Sjálfgefið tekur myndin yfir alla breidd gluggans í minnstu stillingu, í þeirri næst minnstu hálfan gluggann, miðstærðinni 1/3 gluggans, í stórri stærð 1/4 gluggans og í þeirri stærstu 1/6 gluggans. Þannig verður hún ekki of stór í stórum glugga og í þeim minnsta er hún einfaldlega fyrir ofan eða neðan umlykjandi texta í stað þess að vera klesst inn í hann.

Notkun[breyta frumkóða]

Myndinni er bætt við með:

{{bootstrap-mynd|Mynd:Nafn myndar.jpeg}}

en hana má senda til hægri eða vinstri með öðru hvoru:

{{bootstrap-mynd|Mynd:Nafn myndar.jpeg|hægri}}
{{bootstrap-mynd|Mynd:Nafn myndar.jpeg|vinstri}}

Sérsníðing stæðar mynda[breyta frumkóða]

Ef vilji er fyrir því að stilla hlutfall gluggans sem myndin tekur fyrir hverja gluggastærð, má breyta stikunum svo:

{{bootstrap-mynd|Mynd:Nafn myndar.jpeg|hægri|xs=6|sm=4|sm=4|md=3|lg=2|xl=1}}

þar sem hver stiki skilgreinir hversu marga tólftu hluta glugginn á að taka. Stikinn xs=6 þýðir t.a.m. að í "xs" stærðinni tekur myndin hálfan gluggann vegna þess að ${\tfrac {6}{12}}={\tfrac {1}{2}}$ og md=3 þýðir að myndin taki yfir fjórðung gluggans því ${\tfrac {3}{12}}={\tfrac {1}{4}}$ .

@@ Lína 1: / Lína 1: @@
-<includeonly><div class="col-xs-12 col-sm-4 col-md-4 col-lg-3 col-xl-2" style="{{#ifeq: {{{2}}} | hægri | float:right; | }}{{#ifeq: {{{2}}} | vinstri | float:left; | }} {{{style|}}}">[[{{{1}}}]]</div></includeonly><noinclude>
+<includeonly><div class="col-xs-{{{xs|12}}} col-sm-{{{sm|6}}} col-md-{{{md|4}}} col-lg-{{{lg|3}}} col-xl-{{{xl|2}}}" style="{{#ifeq: {{{2}}} | hægri | float:right; | }}{{#ifeq: {{{2}}} | vinstri | float:left; | }} {{{style|}}}">[[{{{1}}}]]</div></includeonly><noinclude>
-Þetta snið má nota til að móta mynd þannig að hún skalist í takt við stærð vafragluggans eftir Bootstrap kerfinu.
+{{bootstrap-mynd|Mynd:Bmnnetwork - responsive design.png|hægri}}
+Þetta snið má nota til að móta mynd þannig að hún skalist í takt við stærð vafragluggans eftir [https://getbootstrap.com/ Bootstrap verkfærasettinu].
+Sjálfgefið tekur myndin yfir alla breidd gluggans í minnstu stillingu, í þeirri næst minnstu hálfan gluggann, miðstærðinni 1/3 gluggans, í stórri stærð 1/4 gluggans og í þeirri stærstu 1/6 gluggans. Þannig verður hún ekki of stór í stórum glugga og í þeim minnsta er hún einfaldlega fyrir ofan eða neðan umlykjandi texta í stað þess að vera klesst inn í hann.
 == Notkun ==
@@ Lína 8: / Lína 11: @@
 <pre><nowiki>{{bootstrap-mynd|Mynd:Nafn myndar.jpeg|hægri}}
 {{bootstrap-mynd|Mynd:Nafn myndar.jpeg|vinstri}}</nowiki></pre>
+=== Sérsníðing stæðar mynda ===
+Ef vilji er fyrir því að stilla hlutfall gluggans sem myndin tekur fyrir hverja gluggastærð, má breyta stikunum svo:
+<pre><nowiki>{{bootstrap-mynd|Mynd:Nafn myndar.jpeg|hægri|xs=6|sm=4|sm=4|md=3|lg=2|xl=1}}</nowiki></pre>
+þar sem hver stiki skilgreinir hversu marga tólftu hluta glugginn á að taka. Stikinn <code>xs=6</code> þýðir t.a.m. að í "xs" stærðinni tekur myndin hálfan gluggann vegna þess að <math>\tfrac{6}{12}=\tfrac{1}{2}</math> og <code>md=3</code> þýðir að myndin taki yfir fjórðung gluggans því <math>\tfrac{3}{12}=\tfrac{1}{4}</math>.
 </noinclude>