Richard Bergeron
  • Email
  • Accueil
  • Caractéristiques
    • Conception adaptée
    • Générateur Mise en page
    • Glisseur Piecemaker
    • Portfolios
    • Code de fonctions abrégés
      • Colonnes
      • Affichage de messages
      • Éléments HTML
      • Icones
      • Glisseurs
      • Onglets et Bascule
    • Gestionnaire de glisseurs
    • Contrôle total
      • Options de contenu
      • Contrôle de police de caractères
      • Options pied de page
      • Options d’affichage
    • Typographie
    • Barres latérales illimitées
  • Modèles de pages
    • Type de pages
      • Page pleine
      • Barre latérale droite
      • Barre latérale gauche
      • Barre latérale double
      • Barre latérale double droite
      • Barre latérale double gauche
    • Pages d’accueil
      • Affaire #1
      • Affaire #2
      • Affaire #3
      • Affaire #4
      • Magazine #1
      • Magazine #2
      • Agence de Design
      • Portfolio Acceuil
      • VitrineBlog
      • Orman
      • McAlister
      • Spécial friandises Web
    • Grille d’affichage
      • Grille d’affichage – 2 Colonnes
      • Grille d’affichage – 3 Colonnes
      • Grille d’affichage – 4 Colonnes
      • Grille d’affichage – 5 Colonnes
    • Archives
    • Liste d’affichage
    • Blog
    • Portfolio
    • Plan du site
    • Redirection
  • Formulaire d’évaluation
  • Produits
    • Commerce électronique
    • Calendrier d’évènements
    • Sharepoint
    • Carte de profil virtuelle
  • Contactez nous
Search
Home» Caractéristiques » Typographie

Typographie

Ci-dessous vous pouvez vous faire une idée de la façon dont le fichier CSS par défaut du thème affectera vos images et la typographie lorsque vous créez des pages et des billets de blogs.

Espacement Paragraphe standard

Donec rutrum, est vel posuere congue, arcu mauris euismod libero, eget mattis est orci vitae nisi. Cras eget urna nunc, nec aliquet dui. Cras sed lacus tellus, in porttitor tortor. Vivamus auctor mattis nunc, quis mattis justo vulputate at. Nam rhoncus mollis convallis.

Nullam in dolor sed leo cursus posuere. Integer in blandit lorem. Curabitur iaculis ornare egestas. Vivamus imperdiet accumsan ipsum, sed convallis dolor imperdiet eget. Cras semper arcu ut est vehicula malesuada. Cras vitae augue nec erat accumsan varius. Sed euismod suscipit ultricies. Fusce sed dapibus elit. Mauris adipiscing turpis arcu, nec lacinia erat. Cras cursus scelerisque dui, vel facilisis lorem imperdiet sed. Integer et sapien augue, ac volutpat.

Texte gaîné d’une image avec une légende

Donec rutrum, est vel posuere congue, arcu mauris euismod libero, eget mattis est orci vitae nisi. Cras eget urna nunc, nec aliquet dui. Cras sed lacus tellus, in porttitor tortor. Vivamus auctor mattis nunc, quis mattis justo vulputate at. Nam rhoncus mollis convallis. Nullam in dolor sed leo cursus posuere sit amet non tortor. Sed facilisis risus sed massa pellentesque sagittis. Quisque felis leo, commodo eu sagittis ut, suscipit nec lectus.

Nullam viverra interdum nunc, vitae malesuada orci dignissim vitae. Etiam bibendum, urna non eleifend adipiscing, est tellus convallis leo, et dignissim justo arcu non dui. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Quisque in tellus eu odio iaculis ultricies. Sed ac dapibus mi. Sed congue quam non ante pharetra id aliquam nunc elementum. Donec et purus id dui pellentesque porta. Nam imperdiet fringilla nunc non malesuada. Donec rutrum, est vel posuere congue, arcu mauris euismod libero, eget mattis est orci vitae nisi. Cras eget urna nunc, nec aliquet dui. Cras sed lacus tellus, in porttitor tortor. Vivamus auctor mattis nunc, quis mattis justo vulputate at. Nam rhoncus mollis convallis. Nullam in dolor sed leo cursus posuere.

Une image standard

Sample Image

<img src="image.jpg" alt="Sample Image" />

Une Image w/class « pretty »

Sample Image

<img src="image.jpg" alt="Sample Image" class="pretty"/>

Une image qui renvoie à un album Popup

Sample Image
* Remarque: Pour avoir un lien d’image à un album pop-up comme dans l’exemple ci-dessus, il vous suffit de créer un lien vers la version agrandie de l’image et le lieu rel = « lightbox » a l’intérieur de la balise <a>.

<a href="image.jpg" title="Example Image" rel="themeblvd_lightbox"><img src="image.jpg" alt="Sample Image" /></a>

Entêtes

H1 Lorem ipsum dolor sit amet

<h1>H1 Lorem ipsum dolor sit amet</h1>

H2 Lorem ipsum dolor sit amet

<h2>H1 Lorem ipsum dolor sit amet</h2>

H3 Lorem ipsum dolor sit amet

<h3>H1 Lorem ipsum dolor sit amet</h3>

H4 Lorem ipsum dolor sit amet

<h4>H1 Lorem ipsum dolor sit amet</h4>

H5 Lorem ipsum dolor sit amet

<h5>H1 Lorem ipsum dolor sit amet</h5>

H6 Lorem ipsum dolor sit amet

<h6>H1 Lorem ipsum dolor sit amet</h6>

Liste non ordonnée:

  • Vestibulum in mauris semper tortor interdum ultrices.
  • Sed vel lorem et justo laoreet bibendum. Donec dictum.
  • Etiam massa libero, lacinia at, commodo in, tincidunt a, purus.
  • Praesent volutpat eros quis enim blandit tincidunt.
  • Aenean eu libero nec lectus ultricies laoreet. Donec rutrum, nisi vel egestas ultrices, ipsum urna sagittis libero, vitae vestibulum dui dolor vel velit.

<ul>
<li>Vestibulum in mauris semper tortor interdum ultrices.</li>
<li>Sed vel lorem et justo laoreet bibendum. Donec dictum.</li>
<li>Etiam massa libero, lacinia at, commodo in, tincidunt a, purus.</li>
<li>Praesent volutpat eros quis enim blandit tincidunt.</li>
<li>Aenean eu libero nec lectus ultricies laoreet. Donec rutrum, nisi vel egestas ultrices, ipsum urna sagittis libero, vitae vestibulum dui dolor vel velit.</li>
</ul>

Liste ordonnée:

  1. Vestibulum in mauris semper tortor interdum ultrices.
  2. Sed vel lorem et justo laoreet bibendum. Donec dictum.
  3. Etiam massa libero, lacinia at, commodo in, tincidunt a, purus.
  4. Praesent volutpat eros quis enim blandit tincidunt.
  5. Aenean eu libero nec lectus ultricies laoreet. Donec rutrum, nisi vel egestas ultrices, ipsum urna sagittis libero, vitae vestibulum dui dolor vel velit.

<ol>
<li>Vestibulum in mauris semper tortor interdum ultrices.</li>
<li>Sed vel lorem et justo laoreet bibendum. Donec dictum.</li>
<li>Etiam massa libero, lacinia at, commodo in, tincidunt a, purus.</li>
<li>Praesent volutpat eros quis enim blandit tincidunt.</li>
<li>Aenean eu libero nec lectus ultricies laoreet. Donec rutrum, nisi vel egestas ultrices, ipsum urna sagittis libero, vitae vestibulum dui dolor vel velit.</li>
</ol>

Bloc de citation:

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus lobortis dictum eros non laoreet. Sed dui dolor, semper ac convallis sed, gravida eu eros. Praesent faucibus tincidunt volutpat. Aenean ac tellus augue, non suscipit massa. Duis pellentesque dignissim metus ac porta. In ultricies mi in dui consequat ac euismod turpis gravida.

<blockquote>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus lobortis dictum eros non laoreet. Sed dui dolor, semper ac convallis sed, gravida eu eros. Praesent faucibus tincidunt volutpat. Aenean ac tellus augue, non suscipit massa. Duis pellentesque dignissim metus ac porta. In ultricies mi in dui consequat ac euismod turpis gravida.</blockquote>

Tables

Header 1 Header 2 Header 3 Header 4
Cell 1 Cell 2 Cell 3 Cell 4
Cell 1 Cell 2 Cell 3 Cell 4
Cell 1 Cell 2 Cell 3 Cell 4
Cell 1 Cell 2 Cell 3 Cell 4

<table cellspacing="0" cellpadding="0">
<tr>
<th>Header 1</th>
<th>Header 2</th>
<th>Header 3</th>
<th>Header 4</th>
</tr>
<tr>
<td>Cell 1</td>
<td>Cell 2</td>
<td>Cell 3</td>
<td>Cell 4</td>
</tr>
<tr>
<td>Cell 1</td>
<td>Cell 2</td>
<td>Cell 3</td>
<td>Cell 4</td>
</tr>
<tr>
<td>Cell 1</td>
<td>Cell 2</td>
<td>Cell 3</td>
<td>Cell 4</td>
</tr>
<tr>
<td>Cell 1</td>
<td>Cell 2</td>
<td>Cell 3</td>
<td>Cell 4</td>
</tr>
</table>

Formulaire Contact

Votre nom (obligatoire)

Votre email (obligatoire)

Sujet

Votre message

(c) 2012 EnSoft - Web Design par Richard Bergeron

    Translate to:

    Powered by Google Translate.
Plugin created thanks to micro sd card , r4i uk , sd card and r4i gold