www obrázok

h1 Vzorový článok môjho "WordPress-u"

(h4 (krátky popis - podnadpis článku) Toto je vzorový článok pre tvorbu článkov s ukážkami predprogramovaných možností)

(aktuálnosť článku – 09/2021)
Návrat na hlavnú stránku.

H3 Prečo tento článok vznikol?

---krátke popísanie prečo, načo, o čom článok je---
V tomto článku sú komplet všetky ukažky predprogramovaných textových a obrázkových blokov, či samotných obrázkov. Aby som si to kedykoľvek mohol pozrieť a následne použiť. Kto by si to pamätal...

Táto deliaca čiara sa robí pomocou div-u: <div class="borderline"></div>

H3 Ak treba nadpisy v článkoch tak H3!

Hlavné H3 nadpisy sú vo farbe článku, menšie H4 nadpisy "čierne". H2 sa nepoužíva, bolo by pre sekcie...

Lorem ipsum dolor sit, amet consectetur adipisicing elit. Totam, ea magni exercitationem quis atque iusto, similique facere in consectetur debitis ad! Debitis pariatur dolor, magnam fugiat architecto expedita! Tempora, nulla.

H4 Ak treba menšie nadpisy v kapitolách.

Iné ako H3 a H4 NEPOUŽÍVAŤ! - nie sú nadefinované nateraz.
A nasleduje text... Každý kus bloku musí byť vždy obalený v p bloku! Ako je vidno p bloky majú medzi sebou už nastavené medzery.

p blok 1 Lorem ipsum dolor sit amet consectetur adipisicing elit. Beatae commodi illo quas quae at nihil consectetur. Quas tenetur magnam impedit illo commodi, non excepturi, nulla quos consequatur soluta sed sequi.

p blok 2 - Lorem ipsum dolor sit amet consectetur adipisicing elit. Labore quod tenetur, porro ad aperiam exercitationem laborum accusantium ipsam laudantium expedita nihil tempore sed ducimus beatae minima corrupti error velit neque!

Ak treba dajaký odkaz tak ten vždy je v hlavnej farbe "článku", ako aj pozadie po bokoch a hlavné nadpisy.

(A toto je text ktorý bude ako doplňujúcii občas (možno pod / nad obrázkom, alebo k danej časti textu... class "small_block" Naštýlovaný je na śírku 90% a ako písmo 90% veľkosti a šikmé.)

Lorem ipsum dolor sit amet consectetur adipisicing elit. Qui, libero! Nemo exercitationem quos unde quaerat, sunt nostrum magnam, deserunt repellendus ratione molestiae quo harum temporibus qui, pariatur quisquam repudiandae maxime!

H3 nadpis na kontrolu pomerov

Nasleduje ukážka predprogramovaných blokov:
(A ako je taký "small_block" text v elemente span? Zdá s že v pohode...)

Lorem ipsum dolor sit amet consectetur adipisicing elit. Eligendi rem atque culpa aut nam velit quaerat harum facere ad obcaecati commodi saepe tempora, iure mollitia, qui ullam ipsa nostrum quia.

H4 nadpis na kontrolu pomerov

Ak potrebujem obrázok s popisným textom tak div class flex_blok a v ňom img obrázok a iba jeden! blok p!!! Je to naštýlované tak aby bol text na stred a celé to bolo širšie ako bežný text v článku. Hore aj dolu je automaticky tá deliaca čiara.

www obrázok

Tu môže byť iba jeden p blok !!! Všetko musí byť v ňom!!! (na krátky popis to stačí...)
Ak potrebujem hrubé písmo tak použijem "strong"
Obrázky majú class img_middle_l alebo img_middle_r podľa toho na ktorej strane ich potrebujem. A samozrejme buď je prvý obrázok a potom text, alebo naopak. Text je mierne "tenší"... Ak idú tieto bloky za sebou tak treba vypínať border-top...

Lorem, ipsum dolor sit amet consectetur adipisicing elit. Aspernatur perspiciatis eligendi aperiam, quos totam officia molestiae, iure quaerat deserunt sapiente pariatur unde. Doloremque maiores quae sunt ducimus quod eius esse.

Lorem ipsum dolor sit amet consectetur adipisicing elit. Porro sed in, quibusdam et laborum eum tempore! Ipsam, animi minus eligendi magni, recusandae fuga et veniam delectus eos, in natus quod!

www obrázok
-div class blok- zabezpečí takýto textový blok...
Lorem Ipsum je fiktívny text, používaný pri návrhu tlačovín a typografie. Lorem Ipsum je štandardným výplňovým textom už od 16. storočia, keď neznámy tlačiar zobral sadzobnicu plnú tlačových znakov a pomiešal ich, aby tak vytvoril vzorkovú knihu. Prežil nielen päť storočí, ale aj skok do elektronickej sadzby, a pritom zostal v podstate nezmenený. Spopularizovaný bol v 60-tych rokoch 20.storočia, vydaním hárkov Letraset, ktoré obsahovali pasáže Lorem Ipsum, a neskôr aj publikačným softvérom ako Aldus PageMaker, ktorý obsahoval verzie Lorem Ipsum.

-p class last_info- zabezpečí takýto textový blok... - Len iná farba...
Lorem Ipsum je fiktívny text, používaný pri návrhu tlačovín a typografie. Lorem Ipsum je štandardným výplňovým textom už od 16. storočia, keď neznámy tlačiar zobral sadzobnicu plnú tlačových znakov a pomiešal ich, aby tak vytvoril vzorkovú knihu. Prežil nielen päť storočí, ale aj skok do elektronickej sadzby, a pritom zostal v podstate nezmenený. Spopularizovaný bol v 60-tych rokoch 20.storočia, vydaním hárkov Letraset, ktoré obsahovali pasáže Lorem Ipsum, a neskôr aj publikačným softvérom ako Aldus PageMaker, ktorý obsahoval verzie Lorem Ipsum.


-div class blokquote- zabezpečí takýto textový blok...
Lorem Ipsum je fiktívny text, používaný pri návrhu tlačovín a typografie. Lorem Ipsum je štandardným výplňovým textom už od 16. storočia, keď neznámy tlačiar zobral sadzobnicu plnú tlačových znakov a pomiešal ich, aby tak vytvoril vzorkovú knihu. Prežil nielen päť storočí, ale aj skok do elektronickej sadzby, a pritom zostal v podstate nezmenený. Spopularizovaný bol v 60-tych rokoch 20.storočia, vydaním hárkov Letraset, ktoré obsahovali pasáže Lorem Ipsum, a neskôr aj publikačným softvérom ako Aldus PageMaker, ktorý obsahoval verzie Lorem Ipsum.

Nie je problém použiť ul či ol zoznam, základný dizajn je ošetrený...:

Alebo ol zoznam:

  1. položka
  2. položka

www obrázok Obrázky majú mnohé nastavenia. Ti malé sú vždy v "p" bloku spolu s textom podľa potreby... Okraj majú iba tu, pre zvýraznenie, inak sú bez okrajov. Každý sa hodí inokedy:
(ak treba tak obalit do clearfixu... Stačí dať tomu p bloku class = "clearfix", alebo dva obrázky do divu s týmto class) www obrázok

img_small_l
www obrázok Lorem ipsum dolor sit amet consectetur adipisicing elit. Reprehenderit quaerat vero nulla ipsam totam dolores obcaecati minima omnis excepturi consequatur! Magnam amet consectetur aspernatur quo nisi ut alias sed quia!

img_small_r
(POZOR - obrázok je aj na začiatku, aj na konci bloku! A pridané class replace pre lepší dizajn na mobiloch!
www obrázok Lorem ipsum dolor sit amet consectetur adipisicing elit. Reprehenderit quaerat vero nulla ipsam totam dolores obcaecati minima omnis excepturi consequatur! Magnam amet consectetur aspernatur quo nisi ut alias sed quia! www obrázok

img_middle_l
www obrázok Lorem ipsum dolor sit amet consectetur, adipisicing elit. Sapiente vel quod est ullam at, doloremque dolores obcaecati illo laboriosam nemo rem corrupti placeat deserunt voluptate libero cumque. Totam, dolor at?

img_center_small

www obrázok

img_center_half

www obrázok

img_half_l + img_half_r

www obrázok www obrázok

img_compare_l + img_compare_r

www obrázok www obrázok