Titre header

Titre main au même niveau sémantique que le titre header

Essai CSS avec les recommandations OOCSS, mise en page responsive avec FLEX. En travaux ! Le code intégrale se trouve dans le code source de la page, CSS comprise.

Lorem ipsum dolor. Varius tempus ve nullam egestas mauris dui senectus imperdiet. Dis. Hendrerit vitae. Odio, phasellus in, vulputate proin non nisl sagittis suspendisse, sed. Mollis ipsum, est purus leo eleifend. Nibh. Facilisis fusce primis scelerisque felis. Pharetra condimentum per montes in, bibendum. Vulputate lorem ac nostra at ultrices eni, elit quis vestibulum nisi. Et consequat velit at dignissim ve, mi. Lorem ipsum dolor. Varius tempus ve nullam egestas mauris dui senectus imperdiet. Dis. Hendrerit vitae. Odio, phasellus in, vulputate proin non nisl sagittis suspendisse, sed. Mollis ipsum, est purus leo eleifend. Nibh. Facilisis fusce primis scelerisque felis. Pharetra condimentum per montes in, bibendum. Vulputate lorem ac nostra at ultrices eni, elit quis vestibulum nisi. Et consequat velit at dignissim ve, mi. Mollis ipsum, est purus leo eleifend. Nibh. Facilisis fusce primis scelerisque felis.

Titre paragraphe

ATTENTION !Titre pargraphe est mis dans une balise h2 pour le respect de la sémantique avec un style h4-size pour la taille de la police. Mais contrairement aux titres de premier niveau dans 'main' avec une classe h3-size, ici la h4-size fonctionne mais ne conserve pas la police d'écriture...

Lorem ipsum dolor. Varius tempus ve nullam egestas mauris dui senectus imperdiet. Dis. Hendrerit vitae. Odio, phasellus in, vulputate proin non nisl sagittis suspendisse, sed. Mollis ipsum, est purus leo eleifend. Nibh. Facilisis fusce primis scelerisque felis. Pharetra condimentum per montes in, bibendum. Vulputate lorem ac nostra at ultrices eni, elit quis vestibulum nisi. Et consequat velit at dignissim ve, mi. Lorem ipsum dolor. Varius tempus ve nullam egestas mauris dui senectus imperdiet. Dis. Hendrerit vitae. Odio, phasellus in, vulputate proin non nisl sagittis suspendisse, sed. Mollis ipsum, est purus leo eleifend. Nibh. Facilisis fusce primis scelerisque felis. Pharetra condimentum per montes in, bibendum. Vulputate lorem ac nostra at ultrices eni, elit quis vestibulum nisi. Et consequat velit at dignissim ve, mi.

Titre main

Lorem ipsum dolor. Varius tempus ve nullam egestas mauris dui senectus imperdiet. Dis. Hendrerit vitae. Odio, phasellus in, vulputate proin non nisl sagittis suspendisse, sed. Mollis ipsum, est purus leo eleifend. Nibh. Facilisis fusce primis scelerisque felis. Pharetra condimentum per montes in, bibendum. Vulputate lorem ac nostra at ultrices eni, elit quis vestibulum nisi. Et consequat velit at dignissim ve, mi. Lorem ipsum dolor. Varius tempus ve nullam egestas mauris dui senectus imperdiet. Dis. Hendrerit vitae. Odio, phasellus in, vulputate proin non nisl sagittis suspendisse, sed. Mollis ipsum, est purus leo eleifend. Nibh. Facilisis fusce primis scelerisque felis. Pharetra condimentum per montes in, bibendum. Vulputate lorem ac nostra at ultrices eni, elit quis vestibulum nisi. Et consequat velit at dignissim ve, mi. Mollis ipsum, est purus leo eleifend. Nibh. Facilisis fusce primis scelerisque felis.