Zwykły tekst

PARAGRAF Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum facilisis, enim vitae hendrerit efficitur, orci nibh vehicula enim, id posuere risus nisl eu elit. Integer maximus eleifend erat, in malesuada dolor facilisis sit amet. Phasellus scelerisque lorem at efficitur posuere. Nulla sapien justo, convallis eget lacus non, tincidunt consectetur leo. Nulla pretium et dui sed varius. Praesent egestas risus et nisl lacinia tincidunt. Aenean fringilla metus arcu, ut blandit dui fermentum vel. Aenean id nisi porta, bibendum nulla vel, bibendum elit. Curabitur semper lacus quis varius consequat.aaaa

PARAGRAF Vestibulum facilisis, enim vitae hendrerit efficitur, orci nibh vehicula enim, id posuere risus nisl eu elit. Integer maximus eleifend erat, in malesuada dolor facilisis sit amet. Phasellus scelerisque lorem at efficitur posuere. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla sapien justo, convallis eget lacus non, tincidunt consectetur leo. Nulla pretium et dui sed varius. Praesent egestas risus et nisl lacinia tincidunt. Aenean fringilla metus arcu, ut blandit dui fermentum vel. Aenean id nisi porta, bibendum nulla vel, bibendum elit. Curabitur semper lacus quis varius consequat.aaaa

---

Testy nagłówków

h1 Nunc eu enim viverra, molestie velit eu, molestie mi.

Pellentesque et nisi a nibh luctus tristique quis at lorem. Fusce sollicitudin ante eu erat gravida, quis lacinia lectus egestas. In a tincidunt erat. Mauris sit amet justo nisi. Integer vitae odio ac neque hendrerit blandit. Praesent ut eros a velit tincidunt porttitor. Vestibulum sed neque sed est maximus accumsan eget sed sapien. Etiam eu tellus ipsum. Sed arcu tortor, cursus eget ornare et, volutpat in odio.

h2 Nunc eu enim viverra, molestie velit eu, molestie mi.

Pellentesque et nisi a nibh luctus tristique quis at lorem. Fusce sollicitudin ante eu erat gravida, quis lacinia lectus egestas. In a tincidunt erat. Mauris sit amet justo nisi. Integer vitae odio ac neque hendrerit blandit. Praesent ut eros a velit tincidunt porttitor. Vestibulum sed neque sed est maximus accumsan eget sed sapien. Etiam eu tellus ipsum. Sed arcu tortor, cursus eget ornare et, volutpat in odio.

h3 Nunc eu enim viverra, molestie velit eu, molestie mi.

Pellentesque et nisi a nibh luctus tristique quis at lorem. Fusce sollicitudin ante eu erat gravida, quis lacinia lectus egestas. In a tincidunt erat. Mauris sit amet justo nisi. Integer vitae odio ac neque hendrerit blandit. Praesent ut eros a velit tincidunt porttitor. Vestibulum sed neque sed est maximus accumsan eget sed sapien. Etiam eu tellus ipsum. Sed arcu tortor, cursus eget ornare et, volutpat in odio.

h4 Nunc eu enim viverra, molestie velit eu, molestie mi.

Pellentesque et nisi a nibh luctus tristique quis at lorem. Fusce sollicitudin ante eu erat gravida, quis lacinia lectus egestas. In a tincidunt erat. Mauris sit amet justo nisi. Integer vitae odio ac neque hendrerit blandit. Praesent ut eros a velit tincidunt porttitor. Vestibulum sed neque sed est maximus accumsan eget sed sapien. Etiam eu tellus ipsum. Sed arcu tortor, cursus eget ornare et, volutpat in odio.

h5 Nunc eu enim viverra, molestie velit eu, molestie mi.

Pellentesque et nisi a nibh luctus tristique quis at lorem. Fusce sollicitudin ante eu erat gravida, quis lacinia lectus egestas. In a tincidunt erat. Mauris sit amet justo nisi. Integer vitae odio ac neque hendrerit blandit. Praesent ut eros a velit tincidunt porttitor. Vestibulum sed neque sed est maximus accumsan eget sed sapien. Etiam eu tellus ipsum. Sed arcu tortor, cursus eget ornare et, volutpat in odio.

h6 Nunc eu enim viverra, molestie velit eu, molestie mi.

Pellentesque et nisi a nibh luctus tristique quis at lorem. Fusce sollicitudin ante eu erat gravida, quis lacinia lectus egestas. In a tincidunt erat. Mauris sit amet justo nisi. Integer vitae odio ac neque hendrerit blandit. Praesent ut eros a velit tincidunt porttitor. Vestibulum sed neque sed est maximus accumsan eget sed sapien. Etiam eu tellus ipsum. Sed arcu tortor, cursus eget ornare et, volutpat in odio.

---

Lista punktowana:

• Quisque id orci orci. Nam vitae urna eget turpis ornare scelerisque.
• Donec libero sapien, sagittis vel eros et, fringilla eleifend erat. Cras elementum justo sit amet purus aliquet, ut efficitur est fermentum. Pellentesque in sem tellus.
• Morbi a nulla ante. Maecenas tempus magna eget elit fermentum maximus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae
• Aenean ultrices facilisis sapien, ac sodales felis sagittis nec.
• Cras elementum justo sit amet purus aliquet.
• Eficitur est fermentum.

Lista numerowana:

1. Quisque id orci orci. Nam vitae urna eget turpis ornare scelerisque.
2. Donec libero sapien, sagittis vel eros et, fringilla eleifend erat. Cras elementum justo sit amet purus aliquet, ut efficitur est fermentum. Pellentesque in sem tellus.
3. Morbi a nulla ante. Maecenas tempus magna eget elit fermentum maximus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae
4. Aenean ultrices facilisis sapien, ac sodales felis sagittis nec.
5. Cras elementum justo sit amet purus aliquet.
6. Eficitur est fermentum.
7. In mattis vehicula facilisis.
8. In hac habitasse platea dictumst.
9. Fusce accumsan nulla a dictum aliquam.
10. Morbi ac gravida erat.
11. Pellentesque ac nisl urna. Maecenas in enim non ipsum ultrices ultricies.

---

Podział na kilka części z wykorzystaniem class Flexible-div

Poniżej mamy widoczne podział na 3 kolumny po 33% szerokości okna przeglądarki. Mamy do wybory prefesiniowane classy po 20% / 25% / 33% / 50%.

Aby zobaczyć, co dają classy Flexibel-Div zaczniej zmieniać szerokość okna przeglądarki. Duis volutpat finibus nunc, non ultrices quam fringilla ut. Integer elementum mattis nulla, sagittis dignissim nibh. Suspendisse potenti. Ut luctus orci tristique, condimentum velit vitae, sodales lectus. Maecenas et eros quam. Maecenas dapibus enim velit, ac viverra justo elementum a. Nam finibus rhoncus orci, nec consectetur dolor volutpat sit amet. Suspendisse porta ligula tortor, sed porttitor ex scelerisque at. Sed ac posuere velit, vitae mollis tortor. Maecenas nec pharetra mi.

Zajrzyś w źródło Artykułu i postaraj sie utworzyć artykułu w innych podziałach, np. 4 x 25% albo 2 x 50% szerokości.

Mała ściągawka: zobacz na stronie http://www.anzena.pl/test-02-flex możecie zobaczyć wszystkie możliwe warianty classy Flexible-DIV

---