Fofo test | Ocy ♪ Moony

Fofo test des deux filles bizarres °^°
 
AccueilAccueil  CalendrierCalendrier  PublicationsPublications  FAQFAQ  RechercherRechercher  MembresMembres  GroupesGroupes  S'enregistrerS'enregistrer  ConnexionConnexion  

 :: Tests ::  :: Codage Voir le sujet précédent Voir le sujet suivant Aller en bas

Résumé des tutoriels

avatar
Messages : 88
Date d'inscription : 05/12/2015
Age : 14
Voir le profil de l'utilisateur




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
  1. Lalalalalaaaa
  2. Lalalalalaaaa
  3. 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)
Revenir en haut Aller en bas
Voir le sujet précédent Voir le sujet suivant Revenir en haut 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: