-
Par jacky-micky le 20 Mai 2020 à 19:15
bonjour marcel Ah Marcel ! Il en a des histoires à raconter. Il est intarissable. D’ailleurs, vous voudriez l’arrêter que vous ne pourriez pas. Il a une mémoire éléphantesque et se souvient de tous les détails de sa vie, qu’il se plait à raconter et qu’il me plait d’entendre
Faites sa connaissance
votre commentaire -
Par jacky-micky le 9 Mai 2020 à 04:05
RETOUR A LA RUBRIQUE
--------------------------------G-CREATION DE TABLEAUX EN HTML------------------------------
420-creer un tableau regulier
nom prenom age profession Pouchard Raymond 38 rouleur Muchamiel Francisco 91 dérouleur 421-creer un tableau irregulier
LEGUME VARIETE SEMIS RECOLTE tomate cornue des Andes fevrier juillet poireau bleu de solaise potiron anou 431-ajouter une ligne d en-tete
legume variete date semis date recolte blette a cotes blanches patate douce reunionnaise mai aout 432-creer un tableau structure
lundi mardi mercredi jeudi 05 12 04 13 07 25 11 07 12 37 15 20 433-fusionner les cellules
MARQUAGE AU SOL LIEU SALLE 1 SALLE 2 SALLE 3 SALLE 4 agence 1 bleu vert rouge agence 2 marron indigo jaune blanc agence 3 jaune noir 434-legende & action sur les colonnes
RELEVÉ DES VENTES Région du NORD SITE NOM NOMBRE DE
VENTESMONTANT
€Béthune Lucien 730 3 112,27 Loos Robert 820 4 277,35 Avesnes Simone 780 3 841,74 TOTAL 2 330 11 231,36 441-bordures du tableau et des colonnes
AN MOIS JOUR 2020 janvier 14 AN MOIS JOUR 2020 janvier 14 442-espacement et couleur des cellules
BORDER-SPACING MARI FEMME ENFANT Robert Simone Jules 443-affichage/ou non des cellules
COMPTES jour Robert Simone lundi 78 mardi 21 63 mercredi 27 444-largeur des colonnes
NOM PRENOM ADRESSE Robert Lefort 51 rue Victor Hugo LILLE NOM PRENOM ADRESSE Robert Lefort 51 rue Victor Hugo LILLE
votre commentaire -
Par jacky-micky le 13 Avril 2020 à 05:18
---------------------------- LECON 38 -------- la propriéré CSS " display " --------------------
-ligne d'ecriture-
382 - propriete : display -
une ligne d ecriture sans 'display'
une ligne d ecriture avec DISPLAY INLINE--
une autre ligne d ecriture avec 'display inline'
une derniere ligne d ecriture sans 'display'
une premiere ligne d'ecriture avec "display block
une deuxieme ligne avecavec un lien vers DISPLAY
une premiere ligne d ecriture"display:list-item"
une deuxieme ligne d ecriture"display:list-item"
une troisieme ligne d ecriture"display:list-item"
une troisieme ligne d ecriture"display:list-item"
une ligne d ecriture ordinaire avant une ligne "display_none"
une ligne d ecriture "display:none"
une ligne d ecriture ordinaire après une ligne "display_none"
une ligne d'écriture "invisibility"
une ligne decriture ordinaire aprsè une ligne "invisibility"
une premièreligne d ecriture en couleuravec "span"
une deuxieme ligne en "span avec "display:block" d ecriture
une troisieme ligne en "span" avec "inline-block" d ecriture
----------------- LECON 39 -------- Gerer le positionnement avec la propriete"position" --------------
391 - propriete : position:static
une premiere ligne d ecriture
une deuxieme ligne avec position:static
une troisieme ligne décalée, avec position:static
une 4ème ligne avec element "left"
392 - propriete : position:relative - texte
une premiere ligne d ecriture
une 2ème ligne décalée vers le bas
une 3eme ligne avec un texte décalé vers la droite
393 - propriete : position:relative - boites
394 - propriete : position:absolute - textes
une 1ere ligne d ecriture normale
une 2eme ligne "position:absolute" "top"
une 3eme ligne normale
395 - propriete : position:absolute - boites
396 - propriete : position:fixed - boites
le carré rouge reste fixe dans la page
397 - propriete :z-index - boites
-positionnement sans "z-index"-
je suis au-dessus
-positionnement avec "z-index"-
il est en-dessous
398 - écrire dans une boite
coucou
----------------------------- LECON 40 -------- --LA PROPRIETE " float"-- --------------
401 - la propriete " float "
je suis la boite beige
le texte doit etre assez long pour arriver au bout de la ligne vers le bord droit de la page pour ensuite revenir vers le bord gauche de la page ou pour dire plus exactement sur le bord de la boite beigequi se trouve sur le bord gauche de la page. Et ainsi de suite a chaque ligne.
4011 - SANS la propriete " float "
une premiere ligne d ecriture
une 2eme ligne d ecriture
4012 - AVEC la propriete " float "
une 1ere ligne d ecriture avec float gauche
une 2ème ligne d ecriture avec float droite
TEST insertion gif anime
4013 - AVEC et SANS la propriete " float "
une 1ere ligne d ecriture avec "float" dans le "div"
une 2eme ligne d ecriture simple
4014 - Probleme de presentation avec la propriete " float "
une 1ere ligne d ecriture
une 2eme ligne d ecriture
LE RECTANGLE VERT DEBORDE DU "div"
une 1ere ligne d ecriture
une 2eme ligne d ecriture
une 1ere ligne d ecriture
une 2eme ligne d ecriture
une 1ere ligne d ecriture
une 2eme ligne d ecriture
une 1ere ligne d ecriture
une 2eme ligne d ecriture
LES RECTANGLES VERTS SE CHEVAUCHENT
402 - La propriete " clear "
une 1ere ligne d ecriture
une 2eme ligne d ecriture
une 1ere ligne d ecriture
une 2eme ligne d ecriture
LES BOITES SONT ALIGNEES avec la propriete "clear"
une 1ere ligne d ecriture
une 2eme ligne d ecriture avec la propriete "clear"
403 - La propriete " clear " avec la valeur "both"
une 1ere ligne d ecriture
une 2eme ligne d ecriture
une 1ere ligne d ecriture
une 2ème ligne d ecriture
la valeur 'both' est appliquee au 2eme conteneur
404 - le pseudo element "clairfix" (voir lecon 56)
une 1ere ligne d ecriture
une 2eme ligne d ecriture
une 1ere ligne d ecriture
une 2eme ligne d ecriture
le pseudo element"clairfix" evite que la boite de droite deborde du conteneur
405 - EXERCICE: Incrustations de boites
Le 1er conteneur est en "position:relative" et "display:inline-block"
Les autres conteneurs sont en "position:absolute" et "display:inline-blockla "position:relative" se place dans le flux normal de la page
la "position:absolute" se place par rapport à son parent le plus procheLes elements "inline-block" n occupent que la place necessaire
Ils se placent sur la meme ligne et leur contenu est de type "block"
votre commentaire -
Par jacky-micky le 25 Mars 2020 à 04:13
---------------------------- LECON 32 ------------------------------
les éléments "p" et "span"
une ligne block d'écriture dans un cadre bleu clair
une ligne block surlignée en vert
une ligne block surlignée en orange sur la même ligne,surlignée en jaune
l'élément "overflow"
une ligne d'écriture assez longue pour dépasser largement le conteneur sans utiliser l'élément "overflow
un teste court
une ligne d'écriture assez longue pour dépasser largement le conteneur avec l'élément "overflow hidden"
un teste court
une ligne d'écriture assez longue pour dépasser largement le conteneur avec l'élément "overflow scroll"
---------------------------- LECON 33 -------- les marges internes ------------------------------
écriture de trois lignes sur fond vert avec une bordure noire
une première ligne d ecriture sans marge
une deuxième ligne d'écriture avec des marges identiques
une troisième ligne avec des marges différentes
---------------------------- LECON 34 -------- gestion des bordures ---------------------------
la gestion des bordures
bordure SOLID
bordure DOUBLE
bordure RIDGE
bordure OUTSET
------l'opacité des bordures-------
un texte noir et une bordure noire
un texte et une bordure noirs opaques
un texte noir et une bordure noire opaque
-----EXERCICE-----
mon tonton et ma tata
A MOI
c'est mon tonton et ma tata
MarcelSimone
-----EXERCICE-2-----
A REVOIR LIGNE 57
---------------------------- LECON 35 -------- gestion des marges externes --------------------
une première ligne d'écriture
une deuxième ligne d'écriture
---------------------------- LECON 36 -------- la propriété : " box-sizing" --------------------
la première ligne sans (box-sizing" déborde de la boite
la deuxième ligne (avec content-box) déborde de la boite
la troisième ligne (avec border-box) s'ajuste à la boite
test d'annulation de la mise en forme de "p"
A REVOIR
essai de boite à 500 px avec "div">la première ligne à 600px, sans "box-sizing" déborde de la boite
la deuxieme ligne à à 600px (avec border-box) s'ajuste à la boite
A REVOIR
---------------------------- LECON 37 -------- les bords arrondis --------------------
une boite sans bord arrondi
une boite avec les 4 coins arrondis identiques
une boite avec des coins en ellipse : 20px/40px
une boite avec des coins en ellipse : 15%/30%
votre commentaire -
Par jacky-micky le 8 Février 2020 à 03:50
---------- LEÇONS CSS ---------
--------------------------LECON 17 -----------------
fond du texte jaune
SELECTEURS ET PROPRIÉTÉS
le même en gras dans l'éditeur
LIGNE CRÉE EN CODE HTML
---------------------LEÇON 20 -------------------
SELECTEURS CSS SIMPLES
METTRE UN TEXTE EN GRAS
TEXTE EN BLEU
TEXTE EN ROUGE
Cliquer sur ce LIEN FICTIF
---------------------LEÇON 21 -------------------
police de caractère normale
police de caractère 24
h3-ecriture en italic-
texte souligné
texte en h2, italique et souligné
-->
écriture après remise par défaut de l'élément h1
un titre orange en h1
---------------------LEÇON 22 -------------------
texte sans précision de police
Texte avec une police "castellar"
- la première ligne de la liste
- la deuxième ligne avec un retrait de 50 px
---------------------LEÇON 23-les éléments div & span-- -------------------
ce texte n'est pas centré
ce texte est centré
ce texte est en bleu fonce sur fond bleu clair
- ce texte est de couleur blanche,
- sur fond blanc, au centre; et a 80% de la largeur de la page
la marge est réduite à droite
dernier essai
Ce texte prend la moitié de la page avec un fond pourpre et une marge a gauche de cent pixels et une marge a droite de trois cents pixels, de plus le texte est centre
une ligne de texte "hors div
une ligne de texte "sous div" avec texte en rouge
une derniere ligne "hors div"
l'élément "div" ne fonctionne pas
---------------------LEÇON 24-les elements block & inline -------------------
appication des blocks
l'element h3 est un element de type blockverification de la mise en forme
INFORMATION : Ce texte est dans un cadre jaune avec les coins arrondis, un bord bleu de 10 px, à 100 pixels des bords droit et gaucheINFORMATION utiliser un div avec un h2pour verifier la place prise avec span
pour verifier la place prise avec divavec h2, element "block" et l'élément span
---------------------LEÇON 25-Notations "long hand" et "short hand" -------------------
mise en forme d'une ligne d'écritureD4 - MISES EN FORME DE TEXTES EN CSS---------------------LEÇON 26-la propriété "font family" et les polices de google" -------------------
une ecriture en indie flower
https://goo.gl/maps/LP3Lipvjpw5ix7st5 NON
style="font-size:16px;width:50%:background- color:lightblue">INFORMATION
Ecriture de deux lignes avec div
INFORMATION--------------------------LECON 27-les autres proprietes liees a la police" -------------------
ceci est le titre
ligne 1
ligne 2
voici
une ligne d
ecriture
voiciune ligne d ecriture
----------------------- LECON 28-les proprietes liees au texte-------------------
alignement du texte
Alignement à gauche
Alignement centré
indentation du texte
la premiere ligne indentee a 20 pixel
la deuxieme ligne qui sera assez longue pour avoir un retour a la ligne automatique et qui sera indentee a 20% de la page. Dans le cours les 20% concernet le body mais dans mon exemple il n y a pas de body
ombrage du texte
un texte avec ombrage H à gauche V en bas et Flou bleu de 1 pixel
un texte avec un flou rouge de 5 pixels
----------------------- LECON 29-les interlignes et les espaces-------------------
une ligne d'écriture ordinaire
une autre ligne d'écriture ordinaire
une ligne d'écriture
avec un interligne de 12 pixelsune ligne d'écriture
avec un interligne de 24 pixelsune ligne d'écriture
avec un interligne de 32 pixelsun -div- pour colorer le texte en rougeune ligne d'écriture avec des espaces normaux
entre les lettres et les motsune ligne d'écriture avec des plus grands espaces entre les lettres
une ligne d'écriture avec des espaces entre les mots
----------------------- LECON 30-LES TEXTES EN COULEUR-------------------
un texte coloré en bleu avec le code - blueviolet -
un autre texte en couleur orange avec les codes -RGB-
encore un texte en couleur rouge avec le code-#-
un premier cadre avec un bordure violette
une deuxième ligne avec
une bordure violette d'intensite 50%
votre commentaire
Suivre le flux RSS des articles de cette rubrique
Suivre le flux RSS des commentaires de cette rubrique