Szablon:Div start/opis

Z Wikibooks, biblioteki wolnych podręczników.
Przejdź do nawigacji Przejdź do wyszukiwania

Użycie[edytuj]

Szablon znaczników: otwierający {{Div start}} i {{Div koniec}}, służące do budowy stron z ramkami znaczników, oparte na obsłudze tagów: <div>...</div> (jest to element blokowy) - (tagi języka HTML), identyfikatorów: id, styli: style (właściwości i ich zawartości przedstawiający język CSS), klas: class (reguł w kaskadowych arkuszach stylów) i atrybutów (inne niż: id, style i class), elementu HTML. Przy czym identyfikatory (id - szablonowe id), style (style - szablonowe styl), klasy (class - szablonowy klasa) i atrybuty podaje się tylko w szablonie otwierającym, a zamykający jest bez parametrów. Tekst jest umieszczany pomiędzy znacznikami: {{Div start}} i {{Div koniec}}, pomiędzy tagami: <div>...</div>.

Opis parametrów[edytuj]

Szablon: {{Div start}}, przyjmują argumenty, którego wartości wraz z odpowiednimi nazwami, oprócz zmiennej 1, w nim, wsadza on do tagu, coś w rodzaju: <tag nazwa="wartość">...</tag>, obsługiwanego przez niego znacznika, prze którego on jest oparty, a oto lista tych zmiennych dla poszczególnych ich podane w poniższych rozdziałach, A szablon {{Div koniec}} nie przyjmuje z żadnych wyliczonych poniższych zmiennych, a w nim tagu: <div>...</div>.

Szablon znacznika otwierający {{Div start}}[edytuj]

Wywołanie
{{Div start|id=|styl=|klasa=|atrybuty=}}
Parametry
  • id - unikalny identyfikator znacznika dla jakikolwiek tagu - sugerowany,
  • styl - styl CSS, właściwości i ich wartości, języka CSS - opcjonalny,
  • klasa - klasa kaskadowych arkuszy stylów, języka CSS - opcjonalny,
  • atrybuty - atrybuty znacznika ukrytego pod zmienną tag, inne niż: style, class i id - opcjonalny.

Szablon znacznika zamykający {{Div koniec}}[edytuj]

Wywołanie
{{Div koniec}}
Parametry
  • brak parametrów.

Wikikod szablonów: {{Div start}} i {{Div koniec}}, zbudowanych za pomocą szablonu znaczników (kombajnów)[edytuj]

Szablony: {{Div start}} i {{Div koniec}}, można wykorzystać do budowy innych szablonów znaczników, one mają kod:

Szablon {{Div start}}
{{Znacznik start|tag=div|id={{{id|}}}|styl={{{styl|}}}|klasa={{{klasa|}}}|atrybuty={{{atrybuty|}}}}}
Szablon {{Div koniec}}
{{Znacznik koniec|tag=div}}

Przykłady[edytuj]

Tabelka z przykładami dla szablonu otwierającego {{Div start}} i zamykającego {{Div koniec}}, przy znaczniku <div>...</div>[edytuj]

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
{{Div start|styl=width:800px;padding:5px;font-size:15px;color:darkslategray;background-color:ivory;border:darkblue 1px solid;}}
{{Lorem ipsum}}
{{Div koniec}}
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
{{Div start|styl=width:800px;padding:5px;color:darkslategray;background-color:ivory;border:darkblue 1px solid;|klasa=czcionka}}
{{Lorem ipsum}}
{{Div koniec}}
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
{{Div start|styl=width:800px;padding:5px;color:darkslategray;|klasa=czcionka|id=przykład2}}
{{Lorem ipsum}}
{{Div koniec}}
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
{{Div start|styl=width:800px;padding:5px;|klasa=tło obramowanie|id=przykład1}}
{{Lorem ipsum}}
{{Div koniec}}
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
{{Div start|styl=width:800px;padding:5px;|klasa=czcionka kolor tło obramowanie}}
{{Lorem ipsum}}
{{Div koniec}}
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
{{Div start|styl=width:800px;padding:5px;|id=przykład}}
{{Lorem ipsum}}
{{Div koniec}}
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[edytuj]

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

Parametry szablonu (strukturyzacja Wizualnego Edytora)[edytuj]

Szablony: {{Div start}} (otwierający) i {{Div koniec}} (zamykający), z zawartością pomiędzy nimi.

Parametry szablonu

ParametrOpisTypStatus
idid

Unikalny identyfikator.

Ciąg znakówsugerowany
stylstyl

Styl CSS - właściwości i ich wartości.

Ciąg znakówopcjonalny
klasaklasa

Reguły do klasy kaskadowych arkuszy stylów CSS.

Ciąg znakówopcjonalny
atrybutyatrybuty

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

Ciąg znakówopcjonalny

Zobacz też[edytuj]

  • {{Div}} - szablon blokowy, w którym tekst formatowany, np.: względem stylów, umieszczamy wewnątrz tego szablonu pomiędzy znacznikami: <div>...</div>,
  • Szablony: {{Znacznik start}} (otwierający) i {{Znacznik koniec}} (zamykający) - szablon, o których te szablony kolejno: {{Div start}} i {{Div koniec}}, są zbudowany, w oparciu o element blokowy: <div>...</div>, gdzie tekst jest umieszczany pomiędzy tymi szablonami.