s html}}
====== Améliorez vos mixins grâce aux fonctions ======
Notes et transcriptions du cours [[https... autre solution. 💪
===== Découvrez la magie des fonctions =====
Il se trouve que Sass a une sacrée boîte ... uleurs]] ! 🎉
</note>
On appelle ces outils des **fonctions**.
En programmation, les fonctions sont omniprésentes, et je sais qu’elles peuvent faire peur. Soyez rass
tout un tas d’outils très utiles que l’on appelle fonctions. Mais qu’est-ce qu’une fonction ?
- Un synonyme de documentation, le mode d’emploi de Sass.
- Une lis... ffectuer des tâches.
++++ Réponse |
Choix 5.
Les fonctions sont des bouts de code préfabriqués prêts à l’em... ntation/modules/math#max|documentation Sass de la fonction max]]. La fonction max vous permet d'obtenir la p
t à modifier, ou juste pour vous rappeler comment fonctionne tel ou tel élément. D’où l’importance de bien n... is catégories, vous serez en mesure de définir sa fonctionnalité et ses relations. Pas mal, non? Mais que so... une section d’une page qui est **autonome et peut fonctionner indépendamment du reste de la page**. Cela peu... sieurs liens.
On nomme un bloc en décrivant sa **fonction**. Nommons notre bloc pour notre barre de navigat
Exactement comme en HTML ! Eh bien, c’est une des fonctionnalités de Sass : le nesting.
Pourquoi on ne code... Sass dans un fichier .sass ?!
Oh que non ! Sass fonctionne très bien avec le CSS. Copiez votre CSS et coll... *syntaxe**, car elle vous permet de bénéficier de fonctionnalités qui vont vous permettre d’écrire du code p... du CSS. Et ce, tout en bénéficiant de toutes les fonctionnalités Sass, et c’est tout l’intérêt !
En “.scs
chaque sélecteur à une catégorie pour définir sa fonctionnalité et ses relations ;
- de dupliquer vos sél... rs à une de ces trois catégories ;
- Définir la fonctionnalité et les relations d’un sélecteur par son nom... is catégories, vous serez en mesure de définir sa fonctionnalité et ses relations par leur nom.
++++
=====... .headers est suivi de deux underscores puis de la fonction de l’élément, ici : title !
++++
===== Question
egroupant vos classes et en les séparant par leur fonction, votre codebase devient plus **facile à maintenir... r trop de règles. Séparer les sélecteurs par leur fonction vous aidera à garder votre code compréhensible et... e sur le long terme.
* Nommez vos sélecteurs en fonction de leur utilité.
Vous venez de franchi... e code et le simplifier en créant des classes par fonction. Mais comment définir quelle classe prend le dess
sque vous nommez vos variables. ''$light-purple'' fonctionne très bien pour un violet clair c’est sûr, seule... es **booléens** (boolean), les **nulls** et les **fonctions**.
<note>
Dans ce cours, nous aborderons seulem... ins pour qu’ils s’adaptent encore plus, grâce aux fonctions ? C’est ce que nous allons découvrir dans le pro... u_code|◁ Précédent]] |
[[000_start|⌂ Retour au sommaire]] |
[[230_ameliorer_mixins_via_fonctions|Suivant ▷]]
nt quand on doit appliquer des propriétés CSS, en fonction de la taille de l'écran sur lequel s'affiche le s... ** sous certaines conditions. Dans notre cas : en fonction de la taille de l’écran. Si c’est pour un écran d... mme une tablette, voire un téléphone.
Comment ça fonctionne ? La syntaxe CSS standard des media queries con... dernier chapitre.
[[230_ameliorer_mixins_via_fonctions|◁ Précédent]] |
[[000_start|⌂ Retour au sommaire
es d’installations, de bugs, de librairies qui ne fonctionnent plus, et j’en passe ?
[[https://pages.githu... aire ?
En lisant la documentation 😊 !
<note>
En fonction de vos OS, l’installation varie. Reportez-vous à ... du cours, nous avons omis de parler de plusieurs fonctionnalités de Sass, dans le but de le rendre accessib... tre carrière, vous serez amené à croiser d’autres fonctionnalités de Sass :
* [[https://sass-lang.com/gui
iables et mixins]]
* [[230_ameliorer_mixins_via_fonctions|Améliorez vos mixins grâce aux fonctions]]
* [[240_adapter_code_a_tout_support|Adaptez votre code sur to
importe leur type, sélectionnent les éléments en fonction de leur relation à un élément défini et précis.
... en abusant du nesting !
Le nesting est une des fonctionnalités phares de Sass, mais ce n’est pas la seule