Bandeau

Site de démonstration du jeu de squelettes ESCAL fonctionnant sous SPIP3 et mis à la disposition des Etablissements SColaires de l’Académie de Lyon... et de qui veut.

Forum de l’article

test images pleine page

Qui êtes-vous ?
Votre message

Pour créer des paragraphes, laissez simplement des lignes vides.
Attention ! Si votre message contient un lien, il devra être validé par le webmestre. Inutile de le poster à nouveau ;-)

Ajouter un document

Rappel de la discussion
Réglages des textes avec les images en pleine largeur des articles pleine-page
Jaseur Boréal - le 30 août 2018

J’ai appliqué ces réglages dans perso.css pour ajouter une marge seulement aux paragraphes des textes et aux sous-titres h1, h2, h3, ... pour les articles en "pleine-page" :

.page-article-pleinepage #texte-article {
    text-align: left;
    margin-right: 0%;
    margin-left: 0%;
}

.page-article-pleinepage #texte-article h1, h2, h3, h4{
    text-align: left;
    margin-right: 3%;
    margin-left: 3%;
}

.page-article-pleinepage #texte-article  p{
    margin-right: 3%;
    margin-left: 3%;
    font-size: 1.8rem;
    line-height: 150%; 
}
test images pleine page
Jean Christophe Villeneuve - le 30 août 2018

Hello

A mon avis, les text-align : left sont inutiles.

Et je rajouterais un

ul.portfolio_ligne li {
    list-style: none;
}

pour virer les points disgracieux devant le descriptif des photos

Sinon, ça rend bien !

Animer certaines lignes de textes en pleine-page
Jaseur Boréal - le 30 août 2018

J’ai essayé d’animer certaines lignes de textes avec les formules ci-dessous , à régler selon tests et souhaits ....

 75% {
    font-size: 300%;
    margin-left: 25%;
    width: 150%;
    line-height: 300%;
}

h1, h2, h3, h4 {
  animation-duration: 3s;
  animation-name: slidein;
  animation-iteration-count: infinite;
}

@keyframes slidein {
  from {
    margin-left: 100%;
    width: 300%; 
  }

  75% {
    font-size: 300%;
    margin-left: 25%;
    width: 150%;
  }

  to {
    margin-left: 0%;
    width: 100%;     }
}

Tester pour affinet les réglages .... ;-))

Derniers commentaires

Intertitre à la ligne
h2 ça marche impec, merci !

Cible du bouton "home"
Ce n’est pas bien grave, merci.

Cible du bouton "home"
Ah oui, dans cette configuration, ça ne doit pas fonctionner. Et je ne vois pas comment faire (…)

Intertitre à la ligne
Ah peut-être n’est-ce pas un intertitre de premier niveau. Essaie avec h4 ou h5 à la place de h3.

Espace autour des photos dans les articles
Parfait ! Merci.

Plan du site Contact Mentions légales Données personnelles et cookies Espace privé squelette RSS

2009-2024 © Escal - Tous droits réservés
Haut de page
Réalisé sous SPIP
Habillage ESCAL 5.0.5