Résumé des tutoriels

LEGO® Icons 10329 Les Plantes Miniatures, Collection Botanique

Fofo test \| Ocy ♪ Moony :: Tests :: :: Codage
Résumé des tutoriels

Messages : 91

Date d'inscription : 05/12/2015

Age : 20

Ocy

Admin

Sam 9 Déc - 21:06

Propriétés utiles :
display :
inline-block: permet de mettre de blocs côtes à côtes sans utiliser le tableau.

flex : permet de faire un gros bloc dans lequel les blocs que l'on met sont alignés.

flex-start, flex-end & center : aligner à gauche, a droit et au centre
space-between & space-around : étendre les blocs sur tout le conteneur, laisser un espace au début pour space-around

align-items :
flex-start, flex-end & center : aligner en haut à gauche, aligner en bas à gauche et aligner au centre à gauche

Faire une infobulle

Version HTML

Contenu visible

Contenu invisible

Code:: <div class="infobulle">Contenu visible
<div>Contenu invisible</div>
</div>

Version CSS

Code:: .infobulle{position: relative; display: inline-block; width: 70px; height: 70px;}.infobulle div{position: absolute; top: 0px; left: 50px; z-index: 2; width: 70px; height: 70px; opacity: 0; visibility: hidden; transition: all 1s;}.infobulle:hover div{opacity: 1; visibility: visible;}

Text-shadow
La balise est
text-shadow: _px _px _px #couleur
Première valeur : axe x, horizontal
Deuxième valeur : axe y, vertical
Troisième valeur : niveau de flou
Quatrième valeur : couleur
On peut mettre plusieurs ombres :

BLABLA

Effet 3D

Les listes :
Non ordonnées :

blablabla
Balan

Ordonnée

Lalalalalaaaa
Lalalalalaaaa
Lalalalalaaaa

Définition / descriptive

HTML: Langage de description qui permet de construire la structure de base d'une page web.
CSS: Langage de description qui est souvent associé au HTML, il permet l'organisation et la mise en page du contenu d'une page web.
JavaScript: Langage de programmation qui permet de mettre en œuvre des éléments complexes et dynamiques sur des pages Web.

Structure de base d'une page HTML

Code:: <!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Titre du document</title>
<style>
/* CSS */
</style>
</head>

<body>
Contenu du document......
</body>

</html>

< !DOCTYPE html > → Indique le type de document
< html > permet de dire que le HTML commence ici et termine lorsqu'on ferme les balises (se ferme)
< head > → L'entête, le contenu est invisible mais permet de décrire le document ainsi que le CSS. (se ferme)
< meta > → fournit des informations sur la page
charset → (se met avec meta) type de caractères utilisés. "utf-8" veut dire latin étendu, donc important car accents.
< title > → Le titre d'en haut de la page, dans l'onglet (se ferme)
< body > → on met tout le code de la page (se ferme)

Page 1 sur 1

Permission de ce forum:

Vous ne pouvez pas répondre aux sujets dans ce forum

Fofo test | Ocy ♪ Moony :: Tests ::

:: Codage

Sauter vers: