Demo Arthur 3 | Stijlen

Voorbeelden met verschillende stijlen voor tekstgrootte en kleur.
Dit zijn de kleuren die je in de customizer hebt gedefinieerd.

Tekst

Ga naar Blok > Geavanceerd > Extra css-classes

Tekstgrootte	Kleuren voor tekst en koppen	Kleuren voor kaders
groot	t-kleur	kleur
(normale grootte, geen stijl)	t-donker (standaard voor tekst)	donker
klein	t-donkergrijs	donkergrijs
mini	t-grijs	grijs
	t-lichtgrijs	lichtgrijs
	t-wit	wit
	t-kleurtint (lichte tint van standaardkleur)	kleurtint
	t-accent (voor accenten)	accent

Groep (geavanceerd)

Beeldvullende blokken maken

Balk over hele breedte met groep	Bovenste balk voor transparante header
alignfull	transparante-header	–

Tekstgrootte

Voorbeelden van verschillende tekstgrootte

Tekst met extra css class “groot”

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Phasellus et leo eget tellus hendrerit scelerisque. Cras venenatis ultrices nulla. Quisque at dui. Fusce ante leo, mattis vitae, lobortis vitae, cursus porta

Tekst zonder stijl

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Phasellus et leo eget tellus hendrerit scelerisque. Cras venenatis ultrices nulla. Quisque at dui. Fusce ante leo, mattis vitae, lobortis vitae, cursus porta

Tekst met extra css class “klein”

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Phasellus et leo eget tellus hendrerit scelerisque. Cras venenatis ultrices nulla. Quisque at dui. Fusce ante leo, mattis vitae, lobortis vitae, cursus porta

Tekst met extra css class “mini”

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Phasellus et leo eget tellus hendrerit scelerisque. Cras venenatis ultrices nulla. Quisque at dui. Fusce ante leo, mattis vitae, lobortis vitae, cursus porta

Kleuren

Nu met de class “t-kleur”. Tekst krijgt dan de accentkleur.

Tekst met extra css class “groot t-kleur”

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Phasellus et leo eget tellus hendrerit scelerisque. Cras venenatis ultrices nulla. Quisque at dui. Fusce ante leo, mattis vitae, lobortis vitae, cursus porta

Tekst met extra css class “t-kleur”

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Phasellus et leo eget tellus hendrerit scelerisque. Cras venenatis ultrices nulla. Quisque at dui. Fusce ante leo, mattis vitae, lobortis vitae, cursus porta

Tekst met extra css class “klein t-kleur”

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Phasellus et leo eget tellus hendrerit scelerisque. Cras venenatis ultrices nulla. Quisque at dui. Fusce ante leo, mattis vitae, lobortis vitae, cursus porta

Tekst met extra css class “mini t-kleur”

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Phasellus et leo eget tellus hendrerit scelerisque. Cras venenatis ultrices nulla. Quisque at dui. Fusce ante leo, mattis vitae, lobortis vitae, cursus porta

Tekst met kaders

Nu met een kadertje eromheen. t-wit maakt de letters wit. “Kleur” zorgt voor de accentkleur. Padding geeft een kleine ruimte om de tekst van 20 pixels.

Tekst met extra css class “groot t-wit kleur padding”

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Phasellus et leo eget tellus hendrerit scelerisque. Cras venenatis ultrices nulla. Quisque at dui. Fusce ante leo, mattis vitae, lobortis vitae, cursus porta

Tekst met extra css class “t-wit kleur padding”

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Phasellus et leo eget tellus hendrerit scelerisque. Cras venenatis ultrices nulla. Quisque at dui. Fusce ante leo, mattis vitae, lobortis vitae, cursus porta

Button met class

Gutenberg kolommen met class

Gutenberg block met class voor gevorderden

Hieronder werkt bijna, nog mee bezig