diff options
author | Atsuto Yamashita <atyamash@yahoo-corp.jp> | 2022-03-15 19:47:35 +0900 |
---|---|---|
committer | GitHub <noreply@github.com> | 2022-03-15 19:47:35 +0900 |
commit | 9bf38df91fadd199a5ea45ad79d5e111ddfb3fe0 (patch) | |
tree | 71952407ea41c86feabef4214610d59e15aae55d /files/fr/learn/css | |
parent | c2678137db5f97ad1fe39e872529159a1afafec1 (diff) | |
parent | 9e7fbb013772ebab9b35185f0d0836995acbe6db (diff) | |
download | translated-content-9bf38df91fadd199a5ea45ad79d5e111ddfb3fe0.tar.gz translated-content-9bf38df91fadd199a5ea45ad79d5e111ddfb3fe0.tar.bz2 translated-content-9bf38df91fadd199a5ea45ad79d5e111ddfb3fe0.zip |
Merge branch 'main' into fix-typo-client-side-web-apis-intro-ja
Diffstat (limited to 'files/fr/learn/css')
-rw-r--r-- | files/fr/learn/css/building_blocks/advanced_styling_effects/colorful-heart.png | bin | 23396 -> 0 bytes | |||
-rw-r--r-- | files/fr/learn/css/building_blocks/styling_tables/index.md | 2 | ||||
-rw-r--r-- | files/fr/learn/css/css_layout/legacy_layout_methods/index.md | 2 | ||||
-rw-r--r-- | files/fr/learn/css/css_layout/responsive_design/index.md | 2 | ||||
-rw-r--r-- | files/fr/learn/css/first_steps/index.md | 2 | ||||
-rw-r--r-- | files/fr/learn/css/howto/index.md | 2 | ||||
-rw-r--r-- | files/fr/learn/css/styling_text/fundamentals/index.md | 2 | ||||
-rw-r--r-- | files/fr/learn/css/styling_text/styling_links/external-link-52.png | bin | 532 -> 0 bytes |
8 files changed, 6 insertions, 6 deletions
diff --git a/files/fr/learn/css/building_blocks/advanced_styling_effects/colorful-heart.png b/files/fr/learn/css/building_blocks/advanced_styling_effects/colorful-heart.png Binary files differdeleted file mode 100644 index 66549ebd58..0000000000 --- a/files/fr/learn/css/building_blocks/advanced_styling_effects/colorful-heart.png +++ /dev/null diff --git a/files/fr/learn/css/building_blocks/styling_tables/index.md b/files/fr/learn/css/building_blocks/styling_tables/index.md index 253f8338c6..bfebc37bc0 100644 --- a/files/fr/learn/css/building_blocks/styling_tables/index.md +++ b/files/fr/learn/css/building_blocks/styling_tables/index.md @@ -252,7 +252,7 @@ table { } ``` -- Plus haut, nous avons vu comment on utilisait le sélecteur {{cssxref(":nth-child")}} pour sélectionner un élément enfant. Il est aussi possible de donner une formule en paramètre afin qu'il sélectionne une suite d'éléments. La formule 2n-1 sélectionne tous les enfants impairs (1, 3, 5, etc.) et la formule 2n sélectionne tous les enfants pairs (2, 4, 6, etc.). Nous avons utilisé les mots-clés `odd` (impair) et `even `(pair) dans notre code ; ils font exactement la même chose que les formules susmentionnées. Dans ce cas, nous donnons aux lignes paires et impaires des couleurs différentes (clinquantes) +- Plus haut, nous avons vu comment on utilisait le sélecteur {{cssxref(":nth-child")}} pour sélectionner un élément enfant. Il est aussi possible de donner une formule en paramètre afin qu'il sélectionne une suite d'éléments. La formule 2n-1 sélectionne tous les enfants impairs (1, 3, 5, etc.) et la formule 2n sélectionne tous les enfants pairs (2, 4, 6, etc.). Nous avons utilisé les mots-clés `odd` (impair) et `even` (pair) dans notre code ; ils font exactement la même chose que les formules susmentionnées. Dans ce cas, nous donnons aux lignes paires et impaires des couleurs différentes (clinquantes) - Nous avons également ajouté un motif d'arrière-plan répétitif sur toutes les lignes ; il donne un peu de bruit (un `.png` semi-transparent avec un peu de distorsion visuelle) pour donner une certaine texture. - Finalement, nous avons donné à toute la table une couleur de fond unie de façon à ce que les navigateurs qui ne prennent pas en charge le sélecteur `:nth-child` disposent encore d'une teinte de fond pour les lignes du corps de tableau. diff --git a/files/fr/learn/css/css_layout/legacy_layout_methods/index.md b/files/fr/learn/css/css_layout/legacy_layout_methods/index.md index 7fd67d23b5..6d0e3d27ee 100644 --- a/files/fr/learn/css/css_layout/legacy_layout_methods/index.md +++ b/files/fr/learn/css/css_layout/legacy_layout_methods/index.md @@ -562,7 +562,7 @@ Regardez dans le fichier skeleton.css, vous verrez la CSS appliquée quand on } ``` -Les éléments ne peuvent faire partie d'une trame que s'ils sont à l'intérieur d'une ligne, donc avec notre exemple précédent nous aurons besoin d'un `<div>` supplémentaire ou d'un autre élément de la classe `row` imbriqué entre le `<div>` de `content `et les véritables conteneurs `<div> `de contenu. Nous avons aussi déjà fait cela. +Les éléments ne peuvent faire partie d'une trame que s'ils sont à l'intérieur d'une ligne, donc avec notre exemple précédent nous aurons besoin d'un `<div>` supplémentaire ou d'un autre élément de la classe `row` imbriqué entre le `<div>` de `content` et les véritables conteneurs `<div>` de contenu. Nous avons aussi déjà fait cela. Disposons maintenant les boîtes conteneur. Skeleton est fondé sur une trame de 12 colonnes. Les boîtes de la ligne supérieure nécessitent toutes des classes `one column` pour qu'elles se répartissent à raison de une par colonne. diff --git a/files/fr/learn/css/css_layout/responsive_design/index.md b/files/fr/learn/css/css_layout/responsive_design/index.md index 87fefdde89..9c4fafc963 100644 --- a/files/fr/learn/css/css_layout/responsive_design/index.md +++ b/files/fr/learn/css/css_layout/responsive_design/index.md @@ -280,7 +280,7 @@ Pourquoi est-ce nécessaire? Parce que les navigateurs mobiles ont tendance à m Cette balise meta existe car lorsque l'Iphone original fut lancé et que les gens commencèrent à regarder des sites web sur un petit écran de téléphone, la plupart des sites n'étaient pas optimisés pour les mobiles. Le navigateur mobile définissait donc la largeur de la fenêtre d'affichage à 960 pixels, affichait la page à cette largeur et affichait le résultat sous la forme d'une version zoomée de la disposition du bureau. Les autres navigateurs mobiles (comme sur Google Android) faisaient la même chose. Les utilisateurs pouvaient zoomer et parcourir le site Web pour voir les éléments qui les intéressaient, mais l'affichage était mauvais. Vous le verrez toujours aujourd'hui si vous avez le malheur de tomber sur un site qui n'est pas responsive. -Le problème est que votre responsive design avec des points de coupure et des media queries ne fonctionnera pas comme prévu sur les navigateurs mobiles. Si vous avez une disposition pour écran étroit qui démarre à une largeur de fenêtre de 480 pixels ou moins, et que la fenêtre est définie à 960 pixels, vous ne verrez jamais votre disposition pour écran étroit sur mobile. En définissant `width = device-width`, vous remplacez la largeur par défaut d'Apple de `width = 960px `par la largeur réelle de l'appareil, afin que vos requêtes multimédias fonctionnent comme prévu. +Le problème est que votre responsive design avec des points de coupure et des media queries ne fonctionnera pas comme prévu sur les navigateurs mobiles. Si vous avez une disposition pour écran étroit qui démarre à une largeur de fenêtre de 480 pixels ou moins, et que la fenêtre est définie à 960 pixels, vous ne verrez jamais votre disposition pour écran étroit sur mobile. En définissant `width = device-width`, vous remplacez la largeur par défaut d'Apple de `width = 960px` par la largeur réelle de l'appareil, afin que vos requêtes multimédias fonctionnent comme prévu. **Vous devriez donc toujours inclure la ligne HTML ci-dessus dans la tête de vos documents.** diff --git a/files/fr/learn/css/first_steps/index.md b/files/fr/learn/css/first_steps/index.md index 3861ea29db..be0e15cdfc 100644 --- a/files/fr/learn/css/first_steps/index.md +++ b/files/fr/learn/css/first_steps/index.md @@ -44,5 +44,5 @@ Ce module contient les articles suivants, qui vous présenteront les bases théo ## Voir aussi -- Literacy[ Web intermédiaire 1 : Introduction au CSS](/fr/docs/) +- Literacy [Web intermédiaire 1 : Introduction au CSS](/fr/docs/) - : Un excellent cours de base de la fondation Mozilla qui explore et teste de nombreuses compétences évoquées dans le module _Introduction à CSS_. Approfondissements à propos de l'application de styles sur les éléments HTML d'une page Web, les sélecteurs CSS, les attributs et valeurs.P diff --git a/files/fr/learn/css/howto/index.md b/files/fr/learn/css/howto/index.md index f613014a6c..c31fe1ece3 100644 --- a/files/fr/learn/css/howto/index.md +++ b/files/fr/learn/css/howto/index.md @@ -38,7 +38,7 @@ Les liens suivants pointent vers des solutions aux problèmes courants que vous - [Comment contrôler le contenu débordant](/fr/Apprendre/CSS/Introduction_%C3%A0_CSS/Le_mod%C3%A8le_de_bo%C3%AEte#Les_d%C3%A9passements) - [Comment contrôler la partie des boîtes CSS dessinées au-dessus de l'arrière-plan](/fr/Apprendre/CSS/Introduction_%C3%A0_CSS/Le_mod%C3%A8le_de_bo%C3%AEte#L%27arri%C3%A8re-plan) - [Comment définir _"inline_", _"block"_ et _"inline-block"_ ?](/fr/Apprendre/CSS/Introduction_%C3%A0_CSS/Le_mod%C3%A8le_de_bo%C3%AEte#Les_types_de_bo%C3%AEte) -- [Comment créer des boîtes fantaisies ](/fr/Apprendre/CSS/Comment/Cr%C3%A9er_de_belles_bo%C3%AEtes) (lire aussi le module [Styles pour boites](/fr/docs/Learn/CSS/Styling_boxes), généralités). +- [Comment créer des boîtes fantaisies](/fr/Apprendre/CSS/Comment/Cr%C3%A9er_de_belles_bo%C3%AEtes) (lire aussi le module [Styles pour boites](/fr/docs/Learn/CSS/Styling_boxes), généralités). - [Comment utiliser `background-clip` pour contrôler combien de boîtes sont impactées par l'image de fond-d'écran](/fr/Apprendre/CSS/Comment/Cr%C3%A9er_de_belles_bo%C3%AEtes#Les_arri%C3%A8re-plans) - [Comment changer complètement le modèle de boîte en utilisant `box-sizing`](/fr/docs/Learn/CSS/Styling_boxes/Box_model_recap#Changing_the_box_model_completely) - [Comment contrôler l'arrière-plan](/fr/docs/Learn/CSS/Styling_boxes/Backgrounds) diff --git a/files/fr/learn/css/styling_text/fundamentals/index.md b/files/fr/learn/css/styling_text/fundamentals/index.md index c56023c1f9..6b635b6014 100644 --- a/files/fr/learn/css/styling_text/fundamentals/index.md +++ b/files/fr/learn/css/styling_text/fundamentals/index.md @@ -262,7 +262,7 @@ CSS fournit quatre propriétés communes pour modifier le poids et l'emphase vis - {{cssxref("font-style")}} : utilisé pour appliquer ou enlever le style italique. Les valeurs possibles sont les suivantes (vous ne l'utiliserez que rarement, sauf si vous souhaitez désactiver le style italique pour une raison quelconque) : - `normal` : fige le texte en police normale (suppression du style italique existant). - - `italic `: met le texte en _version italique de la police_ si elle est disponible ; si elle n'existe pas, le style italique sera émulé avec l'option oblique à la place. + - `italic` : met le texte en _version italique de la police_ si elle est disponible ; si elle n'existe pas, le style italique sera émulé avec l'option oblique à la place. - `oblique` : force le texte à utiliser une version simulée de fonte italique, créée en _inclinant la version normale_. - {{cssxref("font-weight")}} : définit la graisse du texte. La propriété peut avoir de nombreuses valeurs s'il y a de nombreuses variantes de polices disponibles (comme _-light_, _-normal_, _-bold_, _-extrabold_, _-black_, etc.), mais en réalité, vous les utiliserez rarement en dehors de `normal` et `bold` (gras): diff --git a/files/fr/learn/css/styling_text/styling_links/external-link-52.png b/files/fr/learn/css/styling_text/styling_links/external-link-52.png Binary files differdeleted file mode 100644 index 7a34cff47c..0000000000 --- a/files/fr/learn/css/styling_text/styling_links/external-link-52.png +++ /dev/null |