tc.
</note>
Voyons maintenant quelle balise HTML utiliser pour saisir du texte dans un formulaire.
===== ... gne est une zone de texte d’une seule ligne. On l'utilise pour des champs de texte qui ne requièrent que qu... onner un nom à votre zone de texte ; pour cela on utilise l'attribut ''name''.
Ce nom n'apparaît pas sur ... ut name mais avec l'attribut id (que l'on peut utiliser sur toutes les balises).
Un attribut ''name'' e
Pour lier les fichiers ''.css'' et ''.html'', on utilise la balise orpheline <link> dans le fichier ''.html'' : le document HTML utilise la ou les feuilles de styles.
La balise <link> d... aragraphes de notre code), on peut - en théorie - utiliser deux attributs :
- l'attribut class ;
- ou ...
Mais pour ce faire - en pratique - on va surtout utiliser l'attribut ''class''.
Les attributs ''class'' e
s dev développement web css sass html}}
====== Utilisez les variables et mixins ======
Notes et transcr... ne surtout pas toucher !). Si vous avez besoin d’utiliser votre couleur (ou de manger votre chocolat), il vous suffit d’ouvrir la bonne boîte, de l'utiliser et le tour est joué ! (De plus, le reste du bure... OK, il est temps de manger ce chocolat, euh... d’utiliser cette **variable**! 💪
<code sass>
// Ma variabl
===== Question 1 =====
Dans Sass, lorsque vous utilisez ''&'', sous quelle forme se compile le symbole e... ien ul. Cette réponse est fausse. Si vous vouliez utiliser le combinateur parent > enfant, il aurait fallu ... valeur;''
Les réponses 2 et 4 sont fausses : on utilise le symbole “$” et non ”&”. De plus on utilise les “:” pour assigner une valeur et non le symbole “=”.
La
souci c’est que les navigateurs sont incapables d’utiliser Sass en l’état. Pour ça, il vous faut un bon vie... afin que les navigateurs puissent les lire et les utiliser.
Mais attends, du coup on va devoir tout réécri... en Sass.
===== Analysez la syntaxe =====
Pour utiliser Sass, il est important d’apprendre à maîtriser s... colades et aux points-virgules ! À la place, elle utilise uniquement des tabulations et des retours à la li
.
Comment faire ? Comment savoir quelle fonction utiliser ? Je regarde la [[https://sass-lang.com/document... rmet de comprendre comment installer un logiciel, utiliser une fonction ou un service.
</note>
Voici ce qu... essaie, on voit et on essaie à nouveau !
===== Utilisez une fonction avec votre mixin =====
Vous avez l... t maintenant cuire les pancakes, dans notre cas : utiliser notre fonction.
Si on se réfère à notre code :
e ''inline'' et ''block''. Pour cela, vous pouvez utiliser ''display: inline-block;'' qui rend vos éléments... block''. Mais dans les faits, vous verrez qu'on l'utilise bien plus souvent sur des balises ''block'' que ... odes de positionnement disponibles. Pour cela, on utilise la propriété CSS ''position''.
Regardons tout ça... dy, et on met le lien sur un fond blanc.
Ici, on utilise ''position: relative;''. Notre élément a alors un
-size =====
Pour modifier la taille du texte, on utilise la propriété CSS ''font-size'' avec une valeur **... ue, c’est très précis, mais il est conseillé de n'utiliser cette méthode que si on sait sur quelle taille d... ue en px
Pour indiquer une taille absolue, on utilise généralement les pixels. Pour avoir un texte de 1... et de choisir une taille de la même manière qu'on utiliserait un pourcentage.
===== Choisissez une police
tps://openclassrooms.com|Openclassrooms]].
===== Utilisez la balise <header> pour l'en-tête =====
La plu... tion peut en effet avoir son propre ''<header>''.
Utilisez la balise <footer> pour le pied de page
À l'i... omme la livraison ou le paiement sécurisé.
===== Utilisez la balise <nav> pour le menu de navigation ====... /a>
</li>
</ul>
</nav>
</code>
===== Utilisez la balise <main> pour le contenu principal de
olor =====
Pour indiquer une couleur de fond, on utilise la propriété CSS ''background-color''. Elle s'utilise de la même manière que la propriété ''color'', c'est... leur, l'écrire en notation hexadécimale ou encore utiliser la méthode RGB.
Pour indiquer la couleur de fon... ec la "super-propriété" background =====
Si vous utilisez beaucoup de propriétés en rapport avec le fond,
Pour aller à l'essentiel, je vous propose ici d'utiliser directement la super-propriété border qui regrou... ombiner plusieurs valeurs.
Avec border, on peut utiliser jusqu'à trois valeurs pour modifier l'apparence ... le faire sans problème. Dans ce cas, vous devrez utiliser ces quatre propriétés :
* ''border-top'' : bo... it de ne déclarer qu'une seule propriété. Ici, on utilise uniquement la propriété ''border-left'' :
<code
====
Les ''id'' sont uniques. Vous ne pouvez pas utiliser plusieurs fois un ''id'' dans votre HTML.
<code... et tout est fini !
En règle générale, **évitez d’utiliser des id dans vos sélecteurs**. Votre but est d’éc... **valeurs uniques** : tous les sélecteurs qui les utilisent ne peuvent, par définition, être utilisés qu’un... érence entre classes et id, et dans quels cas les utiliser.
</note>
Comme les id ont une spécificité plus
De la même manière que pour Flexbox, lorsque vous utilisez CSS Grids, vous pouvez imaginer un conteneur, un... ées et colonnes. Mais il est également possible d'utiliser des ''em'', ''rem'', et des pourcentages.
Et en... arts de largeur dans les colonnes.
Mais pourquoi utiliser les ''fr'' alors qu'on a des pourcentages ?
Si vous tentez d'utiliser des pourcentages avec CSS Grid, vous verrez que
{{tag>dev web html css}}
====== Utilisez le responsive design avec les Media Queries ======
Notes et tra... affichage standard sur tous les mobiles.
===== Utilisez les règles disponibles =====
Il existe de nombr... asse pas les limites du paragraphe, il va falloir utiliser la propriété CSS ''overflow''. Voici les valeurs... t nécessaire). C'est la valeur que je conseille d'utiliser le plus souvent.
===== En résumé =====
Pour a
>
Les media queries indiquent au navigateur d’**utiliser un ensemble de règles** sous certaines condition... phone portable. Pour exécuter une media query, on utilise **@media**, suivi d’un argument et d’une paire d’... ems: center;
}
}
</code>
<note>
N’hésitez pas à utiliser [[https://www.sassmeister.com/|SassMeister]] pou... nu à différents écrans, en disant au navigateur d’utiliser un ensemble de règles alternatives dans certaine