?> Administration-Exemple

Espace d'administration






Récap des balises HTML et attributs CSS

Aller sur le site

HTML

Il faut entourer de balises <p>un paragraphe</p>

Il faut entourer de balises <h1>Un titre important</h1>

Il faut entourer de balises <h3>Un titre moins important (jusqu'à h6)</h3>

Il faut entourer de balises <div>Un bloc pour lui apporter des propriétés</div>

Exemple <div style="text-align:left">Un bloc à centrer à gauche</div>

Il faut entourer de balises <span style="text-decoration:underline">Un morceau de texte pour lui apporter des propriétés</span>

Exemple <span style="text-decoration:underline">Un bloc pour le centrer à gauche</span>

Pour insérer une image <img src="publicimgs/NomImage.jpg"/> ou publicimgs ne doit pas être oublié ainsi que le / de fin

Pour insérer un lien <a href="https://exemple.fr">le lien cliquable</a> voici comment on procéde

Pour insérer un lien <a id="grey_color" href="https://exemple.fr">le lien cliquable en bouton</a> il faut ajouter id="grey_color"

Ajouter target="_blank" au lien pour ouvrir sur un nouvel onglet du navigateur (si click) <a href="htttps://site.com" target="_blank">on clic</a>

Il faut entourer de balises <blockquote>une citation</blockquote>

Pour un saut de ligne </br>

CSS

Il faut ajouter à la balise <p style="">un paragraphe qui aura les propriétés </p> nommés dans le style=""

exemple <img src="publicimgs/image.png" style="width:300px;margin-left:15px;margin-right:45px;float:left"/> insérera une image d'une largeur de 300px avec marge gauche de 15px, marge droite de 45px et sera placé à gauche de l'élément dans lequel elle est contenue

style="margin:auto" laisse le navigateur definir la taille des marges (margin-left, margin-top, margin-right, margin-bottom)

style="border-radius:25px/25px;border:1px solid black" affichera des bordures arrondies de 25px de rayon avec un trait d'épaisseur de 1px noir

<div style="display:inline-block;text-align:center">Un bloc situé à droite du précédent si il a la place</div>

<div style="display:block">Un bloc situé en dessous du précédent si il n'y a pas de règle qui l'en empêche (le texte sera aligné au centre du bloc)</div>

style="font-size:12px;font-weight:bold" affichera une police de 12px en gras

style="font-size:14px;font-weight:normal;font-style:italic" affichera une police de 14px en écriture italique non gras

style="background-color:yellow" affiche l'élément en jaune (fond); style="background-color:#F7D9B7" affiche l'élément en #F7D9B7-color

style="color:red" affiche les caractères en rouge

Trouver la couleur qui convient sur https://www.webfx.com/web-design/color-picker/ (outil gratuit)

CONSEILS

Les <div> contenant des <div> et doivent être fermées obligatoirement: </div></div>


<div> Bloc Contenant

<div> Bloc1 </div>

<div> Bloc2 </div>

<div> Bloc3 </div>

</div> (fermeture du Bloc) contenant peut vous donner une idée de la présentation de votre contenu


Effacer les cookies et données de site de votre navigateur pour tester vos pages (Les fichiers sont mis en caches et quelquefois les modifications ne s'appliquent qu'à cette condition)