Frank NockeWeb • Frontend • Developer

Parcours

Before hammering out individual pages, one should ensure, his common styles work well. Even in the midst (or maintenance) of a project, with the pages partly or fully standing, it’s great to have a singular, common test page, showcasing every stylistic element there is, including critical edge cases…

To see how things behave, and if they are consistent to each other. So this is, what you are looking at…

headline One is here – Qua de causa Helvetii quoque reliquos Gallos virtute praecedunt.

headline Two is here– Qua de causa Helvetii quoque reliquos Gallos virtute praecedunt.

headline Three is here– Qua de causa Helvetii quoque reliquos Gallos virtute praecedunt.

Helvetii quoque reliquos Gallos virtute praecedunt, quod fere cotidianis proeliis cum Germanis contendunt, cum aut suis finibus eos prohibent aut ipsi in eorum finibus bellum gerunt.

headline Four is here– Qua de causa Helvetii quoque reliquos Gallos virtute praecedunt.

headline Five is here– Qua de causa Helvetii quoque reliquos Gallos virtute praecedunt.

→ If you are interesed in styles & macros, they are all here

gray1 gray2 gray3 gray4 gray5 white
480px 624px 768px 864px 960px 1080px 1200px above
s s-m m m-l l l-xl xl  

Quote styles – Single Line

Yes

Qua de causa Helvetii quoque reliquos Gallos virtute praecedunt, quod fere cotidianis proeliis cum Germanis contendunt,

Column testing:

col-2-sm

Qua de causa Helvetii quoque reliquos Gallos virtute praecedunt, quod fere cotidianis proeliis cum Germanis contendunt, cum aut suis finibus eos prohibent aut ipsi in eorum finibus bellum gerunt. Eorum una, pars, quam Gallos obtinere dictum est, initium capit a flumine Rhodano, continetur Garumna flumine.
Cum aut suis finibus eos prohibent aut ipsi in eorum finibus bellum gerunt. Eorum una, pars, quam Gallos obtinere dictum est, initium capit a flumine Rhodano, continetur Garumna flumine.

Qua de causa Helvetii quoque reliquos Gallos virtute praecedunt, quod fere cotidianis proeliis cum Germanis contendunt, cum aut suis finibus eos prohibent aut ipsi in eorum finibus bellum gerunt. Eorum una, pars, quam Gallos obtinere dictum est, initium capit a flumine Rhodano, continetur Garumna flumine.

(old-fashioned, deprecated way. Use → \{\% include tags/picture.html… ) image-title-here

    const demo = { a:42, b:true};
    let double = (a) => { return 2*a; }
    <header id="x" class='foo' data-x='bar'>
        header 123 ${template}
    </header>

Man sollte das Fell des Bären nicht verkaufen, bevor man ihn erlegt hat.

icons

Keyboard Github Xing Stackoverflow Close Earth Heart


buttons

helperline

plain Anchor linkless Anchor

plain Anchor linkless Anchor

plain Anchor linkless Anchor


anchors

…und jetzt mal den Spieß umdrehen…

Everybody being an anchor…

some plain Anchor text linkless Anchor be here just a span


I’m an inline-style link with title

I’m a relative reference to a repository file

You can use numbers for reference-style link definitions

For some inline html
look here.

Just A Table
col 3 is right-aligned €100
col 2 is centered ¥100
zebra stripes are neat $100

Qua de causa Helvetii quoque reliquos Gallos virtute praecedunt, quod fere cotidianis `proeliis cum Germanis contendunt`, cum aut suis finibus eos prohibent aut ipsi in eorum finibus bellum gerunt.