How Can We Help?
Code CSS
Tips AL&JE
On y trouve tous les meilleurs tips: https://tips.alejeweb.ch
Quelques bases CSS
Pour taper du code CSS on peut faire alt + (
… et ça va ouvrir des crochets.
En cascade ou même niveau:
Cascade (virgules)
.classX, P, h1, h2
Le code va agir sur la classX, dans le paragraphe, le h1 et le h2
Même niveau (espaces):
.classX, p h1, h2
Le code va agir sur la classX, à l’intérieur du paragraphe, sur le h1 et le h2
Exemple:
/* METTRE LA TYPO NEUE HASS GROTESK sur deux classes et sur liste, paragraphe, sélect, … */
.et_pb_button, .single_add_to_cart_button, ul, p, input, select, textarea, legend {
text-transform: uppercase;
font-family: neue-haas-grotesk-text,sans-serif;
font-weight: 500;
font-style: normal;
}
/* METTRE MAJUSCULES sur h1, h2, h3, h4, h5 */
h1, h2, h3, h4, h5 {
text-transform: uppercase;
font-family: neue-haas-grotesk-text,sans-serif;
font-weight: 500;
font-style: normal;
}
1. Font Style
/* font */
h3 { font-family: ‘Karla’; font-size: 16px; color: #111111}
ou uniquement l’épaisseur du gras:
h1 {
font-weight: 900;
}
2. Couleur check box
/* force tick mark color in check box */
.et_pb_contact_field input[type=checkbox]:checked+label i:before {color: #2ea3f2!important;}
3. Liste, changer icône
/* change l’icône des listes */
ul li {
list-style-type: none;
}
ul li::before {
font-family: ‘ETmodules’;
content: « \4b »;
font-size: 120%;
color: #969696;
float: left;
margin-left: -1em;
margin-right: 0.1em;
}
4. Galerie photo, choix nombre de colonnes
Dans Galerie Paramètres/ Avancé/ Personnaliser CSS/ Élément de la galerie/ … on colle ….
/* Pour 2 colonnes*/
width: 50% !important;
margin: 0 !important;
clear: none !important;
/* Pour 3 colonnes*/
width: 33.33% !important;
margin: 0 !important;
clear: none !important;
/* Pour 4 colonnes*/
width: 25% !important;
margin: 0 !important;
clear: none !important;
5. Galerie photo, enlever le nom des images
Dans Divi/ options du thème/ … on colle ce CSS pour enlever les noms des images
/* CACHE TITRE IMAGE GALLERIE */
.mfp-title {
display: none!important;
}
>> voir article: Copier une page (et/ou galerie photo)