accessibilité
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.

Utilisé à ce jour dans 341 sites
Forum de l’article

test images pleine page

Qui êtes-vous ?
Votre message

Pour créer des paragraphes, laissez simplement des lignes vides.

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%;
}

L’exemple test est ici : https://www.lettonie-francija.fr/1174

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

0 | 5 | 10

Pb d’affichage des puces suite à m-à-j
Effectivement, ça marche nickel avec le fichier inc-pied.html d’Escal. Merci (...)

Pb d’affichage des puces suite à m-à-j
Je maintiens qu’il vaudrait mieux repartir du fichier d’escal ...

Pb d’affichage des puces suite à m-à-j
J’ai vidé le cache et les images calculées, puis recalculé la page, mais l’image des mentions (...)

Pb d’affichage des puces suite à m-à-j
Ah oui, il y a d’autres changements dans inc-pied.html Il vaudrait mieux que tu repartes du (...)

Pb d’affichage des puces suite à m-à-j
Vide le cache et recalcule la page, ça devrait suffire.

Plan du site Contact Mentions légales Espace rédacteurs squelette RSS

2009-2020 © Escal V4 - Tous droits réservés
Haut de page
Réalisé sous SPIP
Habillage ESCAL 4.3.50