Pour le fond de la page: et son code: L’ordre de déclaration des valeurs de la propriété background va être le suivant : La valeur relative à la propriété background-image ; Les valeurs relatives aux propriétés background-position / background-size (avec le slash entre les deux valeurs); La valeur relative à la propriété background-repeat ; La valeur relative à la propriété background-attachment ; La valeur relative à la…
Catégorie : web
Structurer une page sur la base de flottants.
Exercice assez complexe que d’utiliser les flottants pour la mise en pages. Voici quelques exemples: Le code CSS: Deuxième exemples: Le CSS: Autre exemple: Avec menu burger. Le code:
Tableau-le retour
Exercice supplémentaire avant d’attaquer autre chose. Le code : On continu Le code : Mais encore Le code :
Flottant
Un petit travail sur les flottants pour la mise en page. Rappel : clear : both; empêche l’élément auquel il est appliqué de remonter. .encadre::after{ content: ‘ ‘; display: table; clear: both; } Empêche le block désigné (encadre) de remonter. Appelé clearfix. Et pour que celui-ci soit complet il faut aussi le ::before .encadre::before{ content:…
Structuration de tableau
Chronologie Albert Einstein en quelques dates année mois évenements année mois évenements 1879 14 mars Naissance d’Albert Einstein Albert Einstein naît à Ulm, dans l’État de Wurtemberg en Allemagne. Sa mère est musicienne, et son père possède une usine électrochimique. Il grandira également auprès de son oncle ingénieur, qui, avec son père, lui donnera le…
Structuration de pages
Nous voyons maintenant la structuration de page html. En visuel il n’y a pas de quoi fouetter un chat, mais ici nous voyons comment structurer une page.
Les images
Aujourd’hui nous voyons plus en détail les possibilités liés aux images en html. La possibilité aussi de les aligner avec un style text-align vetical-align float………. Nous réalisons une page plus complète. Ici la possibilité d’intégrer, des images et des pages d’autre site, dans notre page et de circuler sur ces même pages avec la balise …
Tableau
020 Tableau Tableau sans fusion Cellule 1.1 Cellule 1.2 Cellule 1.3 Cellule 1.4 Cellule 2.1 Cellule 2.2 Cellule 2.3 Cellule 2.4 Cellule 3.1 Cellule 3.2 Cellule 3.3 Cellule 3.4 Cellule 4.1 Cellule 4.2 Cellule 4.3 Cellule 4.4 Tableau 1 Cellule 1.1 Cellule 1.3 Cellule 1.4 Cellule 2.3 Cellule 3.1 Cellule 3.3 Cellule 4.1 Cellule 4.2…
Liste
Liste UL (à puces) les balises<li> sont dans les< ul> et nous refaisons la même chose à l’intérieur des <li> liste OL (numérotée) Même chose que précédemment. Glossaire Le glossaire, lui est différant. La liste des définitions utilise les balises <dl> Dedans il y a les terme à définir <dt> et la définition du terme…