Markdown Toolbox Logo Markdown Toolbox

Home
Blog

Affiliate Link

Sytas Ergonomic Office Chair Home Office Desk Chair with Lumbar Support

The chair I use in my home office. A good balance of budget friendly price and quality. And my 18 month old loves looking in the reflective surface on the back, so there's that.

How do I Add an Image Border in Markdown?

Friday, December 29, 2023

Adding borders to images in Markdown documents involves using a combination of Markdown and HTML. Since standard Markdown doesn't support image styling, HTML tags are used to apply additional CSS styles.

Here's how you can add a border to an image:

  1. Embed the image using standard Markdown image syntax.
  2. Wrap the image in an HTML <div> or <span> tag.
  3. Apply inline CSS to add a border.

For example:

<div style="border: 2px solid black;">![Alt text](image-url.jpg)</div>

This will display the image with a 2px solid black border. You can customize the border style, width, and color by modifying the CSS in the style attribute.

Remember, not all Markdown parsers support HTML and CSS, so this method might not work in all environments.