Wikibooks

Szablon:BrClear

 Dokumentacja szablonu [zobacz] [edytuj] [historia] [odśwież]
Ten szablon jest używany na bardzo wielu stronach.
Aby uniknąć nadmiernego obciążenia serwera, wszystkie eksperymenty należy przeprowadzać w swoim brudnopisie lub na stronach testowych. Przetestowane zmiany powinny być dodawane w jednej edycji. Proszę przedyskutować każdą zmianę przed jej wprowadzaniem.
Osoba dokonująca zmian w tym szablonie powinna być przygotowana do naprawienia niepożądanych efektów ubocznych swoich działań.

Szablonów {{BrClear}} i {{SpanClear}} oraz {{HrClear}} używa się po to, żeby prawidłowo umieścić tekst pod tabelką/obrazkiem (zamiast wstawiać 10 enterów). Szablon {{SpanClear}} różni się od szablonu {{BrClear}} tym, że szablon {{BrClear}} wstawiamy pomiędzy akapitami, a ten następny w akapicie, a ostatni wstawiamy, gdy chcemy mieć odstęp pomiędzy opływanymi elementami, a tekstem.

Użycie

Podstawowe wywołanie {{BrClear}}
{{BrClear}}
Podstawowe wywołanie {{SpanClear}}
{{SpanClear}}
Podstawowe wywołanie {{HrClear}}
{{HrClear}}

Użycie: {{BrClear}} - szablonu wstawionego pomiędzy akapitami dla obiektów opływające opływane obiekty zarówno po prawej i lewej stronie lub tylko po prawej lub po lewej.

Jest zbudowany w oparciu o element: <br />.

Możliwe jest też użycie szablonu z parametrem left lub right:

  • {{BrClear|left}} daje: <p class="br-clear br-clear-left" style="font-size:0;line-height:0;margin:0;padding:0;" ><br style="clear:left" /></p> - tekst jest pod obiektem opływanym po lewej stronie.
  • {{BrClear|right}} daje: <p class="br-clear br-clear-right" style="font-size:0;line-height:0;margin:0;padding:0;" ><br style="clear:right" /></p> - tekst jest pod obiektem opływanym po prawej stronie.

lub bez parametrów:

  • {{BrClear}} daje: <p class="br-clear br-clear-both" style="font-size:0;line-height:0;margin:0;padding:0;" ><br style="clear:both" /></p> - tekst jest pod najbliższymi obiektami opływanymi po lewej i prawej stronie.

Użycie: {{SpanClear}} - szablonu wstawionego w akapicie dla obiektów opływające obiekty zarówno po prawej i lewej stronie lub tylko po prawej lub po lewej.

Jest zbudowany w oparciu o element liniowy: <span>...</span>- szablonu wstawionego w akapicie dla obiektów opływające opływane obiekty zarówno po prawej i lewej stronie lub tylko po prawej lub po lewej.

Możliwe jest też użycie szablonu z parametrem left lub right:

  • {{SpanClear|left}} daje: <span class="span-clear span-clear-left" style="clear:left;height:0px;font-size:0;line-height:0;display:block" >&nbsp;</span> - tekst jest pod obiektem opływanym po lewej stronie.
  • {{SpanClear|right}} daje: <span class="span-clear span-clear-right" style="clear:right;height:0px;font-size:0;line-height:0;display:block" >&nbsp;</span> - tekst jest pod obiektem opływanym po prawej stronie.

lub bez parametrów:

  • {{SpanClear}} daje: <span class="span-clear span-clear-both" style="clear:both;height:0px;font-size:0;line-height:0;display:block" >&nbsp;</span> - tekst jest pod obiektami opływanymi po lewej i prawej stronie.

Użycie: {{HrClear}} - szablonu wstawionego jako pogrubiona kreska przezroczysta pod obiektami opływanymi dla obiektów opływające obiekty zarówno po prawej i lewej stronie lub tylko po prawej lub po lewej.

Jest zbudowany w oparciu o element liniowy: <hr />.

Możliwe jest też użycie szablonu z parametrem left lub right:

  • {{HrClear|left}} daje: <hr class="hr-clear hr-clear-left" style="clear:left;background-color:transparent;height:1em" /> - tekst jest pod obiektem opływanym po lewej stronie.
  • {{HrClear|right}} daje: <hr class="hr-clear hr-clear-right" style="clear:right;background-color:transparent;height:1em" /> - tekst jest pod obiektem opływanym po prawej stronie.

lub bez parametrów:

  • {{HrClear}} daje: <hr class="hr-clear hr-clear-both" style="clear:both;background-color:transparent;height:1em" /> - tekst jest pod najbliższymi obiektami opływanymi po lewej i prawej stronie.

Wikikod szablonów: {{BrClear}} i {{SpanClear}} oraz {{HrClear}}, zbudowanych za pomocą szablonu znaczników (kombajnu)

Szablon {{Znacznik}} można wykorzystać do budowy podanych szablonów znaczników, oto przykłady:

Szablon {{BrClear}}
{{Znacznik|tag=p|klasa=br-clear br-clear-{{{1|both}}} {{{klasa|}}}|styl=font-size:0;line-height:0;margin:0;padding:0;{{{styl|}}}|{{Znacznik|tag=br|samozamykający=tak|styl=clear:{{{1|both}}}}}}}
Szablon {{SpanClear}}
{{Znacznik|tag=span|klasa=span-clear span-clear-{{{1|both}}}|styl=clear:{{{1|both}}};height:0px;font-size:0;line-height:0;display:block|&nbsp;}}
Szablon {{HrClear}}
{{Znacznik|tag=hr|klasa=hr-clear hr-clear-{{{1|both}}}|styl=clear:{{{1|both}}};background-color:transparent;height:1em|samozamykający=tak}}

Przykłady

Bez szablonu

{{Plik|plik=Mokra Jama.jpg|rozmiar=200px|pozycja=lewo}}
{{Plik|plik=Dwoiśniak.jpg|rozmiar=200px|pozycja=prawo}}
{{Lorem ipsum}} dolor sit amet...
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Cyfry: 0123456789; polskie znaki diakrytyczne: ąćęłńóśźżĄĆĘŁŃÓŚŹŻ; znaki podobne: l I 1 , O 0 ; przykład transkrypcji IPA: /ɪɡ'zɑːmpəl əv aɪpiː'eɪ tɹɑːn'skɹɪpʃən/. Arabski: العربية; chiński: 这是一些汉字。 Zhè shì yì xiē; cyrylica: Кириллица; grecki: Ελληνικά; khmerski: កខ; litery skandynawskie: ÅÄÆÖØ åäæöø; tajski: ฟหกดึ้.

 

Z szablonem {{BrClear}}

{{Plik|plik=Mokra Jama.jpg|rozmiar=200px|pozycja=lewo}}
{{Plik|plik=Dwoiśniak.jpg|rozmiar=200px|pozycja=prawo}}
{{BrClear}}
{{Lorem ipsum}} dolor sit amet...


Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Cyfry: 0123456789; polskie znaki diakrytyczne: ąćęłńóśźżĄĆĘŁŃÓŚŹŻ; znaki podobne: l I 1 , O 0 ; przykład transkrypcji IPA: /ɪɡ'zɑːmpəl əv aɪpiː'eɪ tɹɑːn'skɹɪpʃən/. Arabski: العربية; chiński: 这是一些汉字。 Zhè shì yì xiē; cyrylica: Кириллица; grecki: Ελληνικά; khmerski: កខ; litery skandynawskie: ÅÄÆÖØ åäæöø; tajski: ฟหกดึ้.

 

Z szablonem {{SpanClear}}

{{Plik|plik=Mokra Jama.jpg|rozmiar=200px|pozycja=lewo}}
{{Plik|plik=Dwoiśniak.jpg|rozmiar=200px|pozycja=prawo}}
{{SpanClear}}
{{Lorem ipsum}} dolor sit amet...
  Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Cyfry: 0123456789; polskie znaki diakrytyczne: ąćęłńóśźżĄĆĘŁŃÓŚŹŻ; znaki podobne: l I 1 , O 0 ; przykład transkrypcji IPA: /ɪɡ'zɑːmpəl əv aɪpiː'eɪ tɹɑːn'skɹɪpʃən/. Arabski: العربية; chiński: 这是一些汉字。 Zhè shì yì xiē; cyrylica: Кириллица; grecki: Ελληνικά; khmerski: កខ; litery skandynawskie: ÅÄÆÖØ åäæöø; tajski: ฟหกดึ้.

 

Z szablonem {{HrClear}}

{{Plik|plik=Mokra Jama.jpg|rozmiar=200px|pozycja=lewo}}
{{Plik|plik=Dwoiśniak.jpg|rozmiar=200px|pozycja=prawo}}
{{HrClear}}
{{Lorem ipsum}} dolor sit amet...
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Cyfry: 0123456789; polskie znaki diakrytyczne: ąćęłńóśźżĄĆĘŁŃÓŚŹŻ; znaki podobne: l I 1 , O 0 ; przykład transkrypcji IPA: /ɪɡ'zɑːmpəl əv aɪpiː'eɪ tɹɑːn'skɹɪpʃən/. Arabski: العربية; chiński: 这是一些汉字。 Zhè shì yì xiē; cyrylica: Кириллица; grecki: Ελληνικά; khmerski: កខ; litery skandynawskie: ÅÄÆÖØ åäæöø; tajski: ฟหกดึ้.

 

Z szablonem {{BrClear}} i parametrem left

{{Plik|plik=Mokra Jama.jpg|rozmiar=100px|pozycja=lewo}}
{{Plik|plik=Dwoiśniak.jpg|rozmiar=200px|pozycja=prawo}}
{{BrClear|left}}
{{Lorem ipsum}} dolor sit amet...


Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Cyfry: 0123456789; polskie znaki diakrytyczne: ąćęłńóśźżĄĆĘŁŃÓŚŹŻ; znaki podobne: l I 1 , O 0 ; przykład transkrypcji IPA: /ɪɡ'zɑːmpəl əv aɪpiː'eɪ tɹɑːn'skɹɪpʃən/. Arabski: العربية; chiński: 这是一些汉字。 Zhè shì yì xiē; cyrylica: Кириллица; grecki: Ελληνικά; khmerski: កខ; litery skandynawskie: ÅÄÆÖØ åäæöø; tajski: ฟหกดึ้.

Z szablonem {{BrClear}} i parametrem right

{{Plik|plik=Mokra Jama.jpg|rozmiar=200px|pozycja=lewo}}
{{Plik|plik=Dwoiśniak.jpg|rozmiar=100px|pozycja=prawo}}
{{BrClear|right}}
{{Lorem ipsum}} dolor sit amet...


Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Cyfry: 0123456789; polskie znaki diakrytyczne: ąćęłńóśźżĄĆĘŁŃÓŚŹŻ; znaki podobne: l I 1 , O 0 ; przykład transkrypcji IPA: /ɪɡ'zɑːmpəl əv aɪpiː'eɪ tɹɑːn'skɹɪpʃən/. Arabski: العربية; chiński: 这是一些汉字。 Zhè shì yì xiē; cyrylica: Кириллица; grecki: Ελληνικά; khmerski: កខ; litery skandynawskie: ÅÄÆÖØ åäæöø; tajski: ฟหกดึ้.

 

Z szablonem {{SpanClear}} i parametrem left

{{Plik|plik=Mokra Jama.jpg|rozmiar=100px|pozycja=lewo}}
{{Plik|plik=Dwoiśniak.jpg|rozmiar=200px|pozycja=prawo}}
{{SpanClear|left}}
{{Lorem ipsum}} dolor sit amet...
  Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Cyfry: 0123456789; polskie znaki diakrytyczne: ąćęłńóśźżĄĆĘŁŃÓŚŹŻ; znaki podobne: l I 1 , O 0 ; przykład transkrypcji IPA: /ɪɡ'zɑːmpəl əv aɪpiː'eɪ tɹɑːn'skɹɪpʃən/. Arabski: العربية; chiński: 这是一些汉字。 Zhè shì yì xiē; cyrylica: Кириллица; grecki: Ελληνικά; khmerski: កខ; litery skandynawskie: ÅÄÆÖØ åäæöø; tajski: ฟหกดึ้.

Z szablonem {{SpanClear}} i parametrem right

{{Plik|plik=Mokra Jama.jpg|rozmiar=200px|pozycja=lewo}}
{{Plik|plik=Dwoiśniak.jpg|rozmiar=100px|pozycja=prawo}}
{{SpanClear|right}}
{{Lorem ipsum}} dolor sit amet...
  Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Cyfry: 0123456789; polskie znaki diakrytyczne: ąćęłńóśźżĄĆĘŁŃÓŚŹŻ; znaki podobne: l I 1 , O 0 ; przykład transkrypcji IPA: /ɪɡ'zɑːmpəl əv aɪpiː'eɪ tɹɑːn'skɹɪpʃən/. Arabski: العربية; chiński: 这是一些汉字。 Zhè shì yì xiē; cyrylica: Кириллица; grecki: Ελληνικά; khmerski: កខ; litery skandynawskie: ÅÄÆÖØ åäæöø; tajski: ฟหกดึ้.

Z szablonem {{HrClear}} i parametrem left

{{Plik|plik=Mokra Jama.jpg|rozmiar=100px|pozycja=lewo}}
{{Plik|plik=Dwoiśniak.jpg|rozmiar=200px|pozycja=prawo}}
{{HrClear|left}}
{{Lorem ipsum}} dolor sit amet...
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Cyfry: 0123456789; polskie znaki diakrytyczne: ąćęłńóśźżĄĆĘŁŃÓŚŹŻ; znaki podobne: l I 1 , O 0 ; przykład transkrypcji IPA: /ɪɡ'zɑːmpəl əv aɪpiː'eɪ tɹɑːn'skɹɪpʃən/. Arabski: العربية; chiński: 这是一些汉字。 Zhè shì yì xiē; cyrylica: Кириллица; grecki: Ελληνικά; khmerski: កខ; litery skandynawskie: ÅÄÆÖØ åäæöø; tajski: ฟหกดึ้.

Z szablonem {{HrClear}} i parametrem right

{{Plik|plik=Mokra Jama.jpg|rozmiar=200px|pozycja=lewo}}
{{Plik|plik=Dwoiśniak.jpg|rozmiar=100px|pozycja=prawo}}
{{HrClear|right}}
{{Lorem ipsum}} dolor sit amet...
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Cyfry: 0123456789; polskie znaki diakrytyczne: ąćęłńóśźżĄĆĘŁŃÓŚŹŻ; znaki podobne: l I 1 , O 0 ; przykład transkrypcji IPA: /ɪɡ'zɑːmpəl əv aɪpiː'eɪ tɹɑːn'skɹɪpʃən/. Arabski: العربية; chiński: 这是一些汉字。 Zhè shì yì xiē; cyrylica: Кириллица; grecki: Ελληνικά; khmerski: កខ; litery skandynawskie: ÅÄÆÖØ åäæöø; tajski: ฟหกดึ้.

Parametry szablonu (strukturyzacja Wizualnego Edytora)

Szablony: {{BrClear}}, {{SpanClear}} i {{HrClear}} - szablony opływania elementów HTML, używa się po to, żeby prawidłowo umieścić tekst pod tabelką/obrazkiem (zamiast wstawiać 10 enterów). Szablon {{BrClear}} dodajemy, wstawiając pomiędzy akapitami, a {{SpanClear}} w akapicie, dalej szablon {{HrClear}} wstawiamy, gdy chcemy mieć dodatkowy bezwzględny odstęp.

Parametry szablonu[Zarządzaj danymi szablonu]

ParametrOpisTypStatus
Wyrównanie1

"left" lub "right"

Ciąg znakówopcjonalny

Zobacz też

  • {{BrClear}}, {{-}} (przekierowanie do {{BrClear}}) i {{Koniec grafiki}} (przekierowanie do {{BrClear}}) - szablon opływania, zbudowany w oparciu o znacznik: <br />, elementów pływających wsadzany pomiędzy akapitami,
  • {{SpanClear}} - szablon opływania, zbudowany w oparciu o znacznik: <span>...</span> - elementu liniowego, elementów pływających wsadzany wewnątrz akapitu,
  • {{HrClear}} - szablon opływania, zbudowany w oparciu o znacznik: <hr /> - elementu blokowego, z dodatkowym bezwzględnym odstępem,
  • {{DivClear}} - szablon rozpychający rodzica, by on zastosował się do rozmiarów swoich dzieci, zbudowany w oparciu o znacznik: <div>...</div> - elementu blokowego.
p • d • e • U
Ta tabelka przedstawia wszystkie rodzaje szablonów ramek formułujące kod HTML lub wikikod, lub nimi się posługujące.
 
Szablony oparte o tagi w znacznikach
Szablony generujące kod FlexBox
Szablony znaczników
{{Znacznik}} (kombajn) • {{Znacznik start}} (kombajn otwierający) • {{Znacznik koniec}} (kombajn zamykający) • {{Div}} (oparty o div) • {{Div start}} (oparty o div otwierający) • {{Div koniec}} (oparty o div zamykający) • {{Pre}} • {{PreBody}} • {{PreBody2}} • {{PreLine}} • {{PreLineBody}} • {{Pre start}} • {{Pre koniec}} • {{Code}} • {{Tt}} • {{Sub}} • {{Sup}} • {{Su}} • {{P}} • {{Span}} • {{Bdo}} • {{Small}} • {{Big}} • {{Strong}} • {{Br}} • {{Hr}} • {{Center}}
Szablony kotwice
{{Indeksuj}} • {{Kotwica}} • {{Id}}
Ramki pływające
Opływanie elementów HTML
{{BrClear}} • {{-}} (przekierowanie do {{BrClear}}) • {{Koniec grafiki}} (przekierowanie do {{BrClear}}) • {{SpanClear}} • {{HrClear}} • {{DivClear}}
Ramki ustalone
Ten szablon nawigacyjny pokazuje szablony tworzące kod HTML lub wikikod, jeżeli nie używa do tego języka Lua w Scribunto, albo generujące, jeżeli używa do tego tego języka, bądź szablony posługujące się wikikodem na stronach.


Źródło: „https://pl.wikibooks.org/w/index.php?title=Szablon:BrClear&oldid=489930”