--- title: "Comment ajouter des bordures à une image dans Markdown" slug: "how-to-add-borders-to-an-image-in-markdown" description: "Format you images by adding borders to them in the Markdown editor using this simple Hack. " tags: ["Customization", "Images"] updated: 2026-06-22T08:31:03Z published: 2026-06-22T08:31:03Z canonical: "docs.document360.com/how-to-add-borders-to-an-image-in-markdown" --- > ## Documentation Index > Fetch the complete documentation index at: https://docs.document360.com/llms.txt > Use this file to discover all available pages before exploring further. # Comment ajouter des bordures à une image dans Markdown L’éditeur Markdown n’a pas de moyen intégré d’ajouter des bordures aux images. La solution consiste à utiliser la balise HTML `<img>` avec la `border` propriété CSS à l’intérieur de l’attribut `style` , que l’éditeur Markdown de Document360 affiche correctement. --- ## Quand utiliser les bordures d’image - **Captures d’écran avec fond blanc ou clair** — une bordure crée un bord visible entre l’image et la page, empêchant l’image de se fondre dans l’arrière-plan. - **Captures d’écran ou diagrammes d’interface utilisateur** — une bordure fine donne à l’image une apparence propre et contenue, ce qui fonctionne bien pour la documentation technique. - **Regroupement ou emphase** — une bordure sépare visuellement une image du contenu environnant et indique qu’elle est un élément distinct digne d’être examiné. Utilisez les frontières avec parcimonie. Les appliquer à chaque image réduit leur effet et peut donner l’impression que les articles sont encombrés. NOTE Cette technique ne fonctionne que dans **l’éditeur Markdown**. Dans l’éditeur WYSIWYG, utilisez plutôt le bouton de contour dans le panneau des paramètres d’image. --- ## Comprendre la propriété frontalière L’abréviation `border` CSS définit trois valeurs dans cet ordre : | Valeur | Ce qu’il contrôle | Exemple | | --- | --- | --- | | Largeur | Épaisseur de la ligne de frontière | `2px` | | Style | Apparition de la ligne frontalière | `solid`, `dashed`, `dotted` | | Couleur | Couleur de la bordure — tout nom de couleur CSS ou code hexadécimal | `grey`, `#000000` | --- ## Petite référence Remplacez `YOUR_IMAGE_URL`, `YOUR_ALT_TEXT`, et les valeurs de frontière par vos exigences. ``` YOUR_ALT_TEXT ``` Pour personnaliser la bordure, ajustez la largeur, le style et la couleur : ``` YOUR_ALT_TEXT YOUR_ALT_TEXT ``` NOTE Le gris est l’une des couleurs de bordure les plus couramment utilisées aux côtés du noir, car il convient bien aussi bien sur les fonds clairs que foncés. Remplacez-le `grey` par n’importe quel nom de couleur CSS valide (par exemple, `blue`, , `green``yellow`, ) ou un code hexadecimal pour correspondre à votre design. --- ## Comment ajouter une bordure à une image dans Markdown 1. Ouvrez l’article souhaité dans le portail de la Base de connaissances. 2. Collez l’extrait ci-dessous à l’endroit où vous souhaitez que l’image apparaisse. ``` YOUR_ALT_TEXT ``` 1. Remplacez-le `YOUR_IMAGE_URL` par l’URL de votre image. 2. Remplacez-le `YOUR_ALT_TEXT` par une courte description de l’image pour plus d’accessibilité. 3. Ajustez la largeur, le style et la couleur de la bordure selon les besoins — voir le [tableau de référence des propriétés de bordure](/docs/fr/how-to-add-borders-to-an-image-in-markdown#understanding-the-border-property) ci-dessus. --- ## Conséquences ### Sans frontières ![Screenshot of a health check metrics dashboard without a border applied.](https://cdn.document360.io/860f9f88-412e-4570-8222-d5bf2f4b7dd1/Images/Documentation/1_Screenshot-without_shadow_Featured_image-Health_check_metrics%281%29.png) ### Avec la frontière ![Screenshot of a health check metrics dashboard with a 2-pixel solid grey border applied.](https://cdn.document360.io/860f9f88-412e-4570-8222-d5bf2f4b7dd1/Images/Documentation/2_Screenshot-with_shadow_Featured_image-Health_check_metrics%281%29.png) NOTE Vous pouvez combiner une bordure avec une ombre sur la même image en utilisant les deux propriétés CSS de l’attribut `style` . Voir [comment ajouter des ombres à une image dans Markdown](/help/docs/fr/how-to-add-shadows-to-an-image-in-markdown) pour la syntaxe des ombres. ## Related - [Comment aligner l’image dans Markdown](/how-to-align-the-image-in-markdown.md) - [Comment ajouter un accordéon dans Markdown](/how-to-add-accordion-in-markdown.md) - [Comment ajouter de l’espace supplémentaire dans Markdown](/how-to-add-extra-space-in-markdown.md) - [Comment centrer l’alignement du texte dans Markdown](/how-to-center-align-the-text-in-markdown.md) - [Comment ajouter des ombres à une image dans Markdown](/how-to-add-shadows-to-an-image-in-markdown.md) - [Comment changer la couleur du texte dans Markdown](/how-to-change-the-color-of-the-text-in-markdown.md)