Szablon:OverflowWiersz

Z Wikibooks, biblioteki wolnych podręczników.
Przejdź do nawigacji Przejdź do wyszukiwania
Template-info.png Dokumentacja szablonu [zobacz] [edytuj] [historia] [odśwież]

Użycie

Szablon wyświetla suwak w przypadku nadmiarowych rozmiarów w wierszu, oparty na obsłudze tagów: <div>...</div> - (tagi języka HTML), oraz identyfikatorów: id, styli: style (właściwości i ich zawartości przedstawiający język CSS), klas: class, (w kaskadowych arkuszach stylów) i atrybutów (inne niż: id, style i class), elementu HTML.

Opis parametrów

Szablon przyjmuje dwa parametry, w którym pierwszy nieopcjonalny jest wikikod umieszczony w ramce pływającej, jako <div style="overflow-x:auto;">{{{1}}}>...</div>, a drugi styl jest opcjonalny, gdzie tam jest podany styl dla tej ramki. A zmienna: 1 tam umieszczona jest zawartością wikikodu.

Wywołanie
{{OverflowWiersz|1=|id=|styl=|klasa=|atrybuty=}}
Szablon {{OverflowWiersz}} przyjmuje następujące parametry
  • 1 - zawartość tekstu pomiędzy znacznikami kodu komputerowego - wymagany,
  • id - unikatowy identyfikator znacznika - sugerowany,
  • klasa - reguły do klasy tego kodu - opcjonalny,
  • styl - styl CSS tego tekstu - opcjonalny.
  • atrybuty - atrybuty znacznika - opcjonalny.

Przykład zbudowania tego szablonu za pomocą szablonu znaczników (kombajnu)

Ten szablon: {{OverflowWiersz}}, ma kod w zależności od znacznika {{Znacznik}} przedstawiający się:

Szablon {{OverflowWiersz}}
{{Znacznik|tag=div|id={{{id|}}}|styl=overflow-x:auto;{{{styl|}}}|klasa={{{klasa|}}}|atrybuty={{{atrybuty|}}}|{{{1}}}}}

Przykłady dla szablonu {{OverflowWiersz}}

Style są w oparciu o kaskadowe arkusze stylów, które są napisane w stylach przykładów: Znacznik/przykłady.css. W poniższych przykładach należy pamiętać o napisaniu:

<templatestyles src="Szablon:Znacznik/przykłady.css" />

Zatem:


Przykład pierwszy
{{OverflowWiersz|styl=width:750px;height:200px;padding:5px;font-size:15px;color:blue;background-color:yellow;border:blue 1px solid;
      |{{Div|styl = width:800px;height:100px;|1 = {{Lorem ipsum}} }}
  }}
Wynik
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: ฟหกดึ้.
Przykład drugi
{{OverflowWiersz|styl=width:750px;height:200px;padding:5px;color:blue;background-color:yellow;border:blue 1px solid;|klasa=czcionka
      |{{Div|styl = width:800px;height:100px;|1 = {{Lorem ipsum}} }}
  }}
Wynik
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: ฟหกดึ้.
Przykład trzeci
{{OverflowWiersz|styl=width:750px;height:200px;padding:5px;color:blue;|klasa=czcionka|id=przykład2
    |{{Div|styl = width:800px;height:100px;|1 = {{Lorem ipsum}} }}
  }}
Wynik
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: ฟหกดึ้.
Przykład czwarty
{{OverflowWiersz|styl=width:750px;height:200px;padding:5px;|klasa=tło obramowanie|id=przykład1
    |{{Div|styl = width:800px;height:100px;|1 = {{Lorem ipsum}} }}
  }}
Wynik
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: ฟหกดึ้.
Przykład piąty
{{OverflowWiersz|styl=width:750px;height:200px;padding:5px;|klasa=czcionka kolor tło obramowanie
     |{{Div|styl = width:800px;height:100px;|1 = {{Lorem ipsum}} }}
  }}
Wynik
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: ฟหกดึ้.
Przykład szósty
{{OverflowWiersz|styl=width:750px;height:200px;padding:5px;|id=przykład
      |{{Div|styl = width:800px;height:100px;|1 = {{Lorem ipsum}} }}
  }}
Wynik
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: ฟหกดึ้.

  • Widzimy, że w sześciu przykładach powyższych różne są przykłady, ale wynik ten sam, ale one obrazują to samo, czyli widzimy, że niezależnie jak rozplanujemy style pomiędzy style style, klasy class i identyfikatory id, wynik zawsze otrzymujemy ten sam.

Błędy

Błędy należy zgłaszać na stronie Wikibooks:Kwestie techniczne.

Parametry szablonu (strukturyzacja Wizualnego Edytora)

Szablon służy do wyświetlania nadmiarowego wikikodu lub tekstu.

Parametry szablonu

ParametrOpisTypStatus
11

Jest to parametr będący wikikodem lub tekstem.

Ciąg znakówwymagany
Idid

Identyfikator znacznika.

Ciąg znakówsugerowany
Stylstyl

Styl ramki, CSS.

Ciąg znakówopcjonalny
Klasaklasa

Klasa reguł kaskadowych arkuszy stylów.

Ciąg znakówopcjonalny
Atrybutyatrybuty

Atrybuty znacznika, inne niż: id, style i class.

Ciąg znakówopcjonalny

Zobacz też

  • {{Div}} - szablon blokowy pudełek: <div>...</div>, o tekście umieszczanego wewnątrz tego szablonu
  • Szablony: {{Div start}} (otwierający) i {{Div koniec}} (zamykający), pudełek: <div>...</div>, elementu blokowego, o tekście umieszczanego pomiędzy tymi szablonami,
  • {{Znacznik}} - szablon, o który ten szablon, jest zbudowany, w oparciu o element blokowy: <div>...</div>, o tekście umieszczonego wewnątrz tego szablonu.