Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Lære Link in a Text | Links
Test UI Features

bookLink in a Text

Element

Some text before the link Python 3.13.2 documentation Some text after the link.

Source Code

index.html

index.html

copy

Readme

A simple, reusable HTML link that includes an inline SVG icon. It allows the link's destination (href attribute) to be customized and display text without making other changes.

Usage in Markdown

When using this HTML inside a Markdown block, ensure that the code is written in one line to avoid formatting issues. ChatGPT can help format the code properly.

Example

<a href="https://docs.python.org/3.13/" target="_blank"><svg width="1em" height="1em" viewBox="0 0 30 32" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill="none" stroke="#098f67" style="stroke: var(--color1, #098f67)" stroke-linejoin="miter" stroke-linecap="round" stroke-miterlimit="4" stroke-width="2.4156" d="M17.289 17.305v0c-1.754 1.754-4.597 1.754-6.351 0l-7.76-7.759c-1.755-1.755-1.755-4.601 0-6.356v0c1.753-1.753 4.595-1.756 6.351-0.005l6.208 6.187"></path><path fill="none" stroke="#098f67" style="stroke: var(--color1, #098f67)" stroke-linejoin="miter" stroke-linecap="round" stroke-miterlimit="4" stroke-width="2.4156" d="M12.504 13.97v0c1.754-1.754 4.597-1.754 6.351 0l7.762 7.762c1.754 1.754 1.754 4.597 0 6.351v0c-1.754 1.754-4.597 1.754-6.351 0l-5.953-5.953"></path></svg> Python 3.13.2 documentation</a>

Customization

  • Change the href attribute to point to the desired URL;
  • Modify the text inside the <a> tag to provide relevant information about the link;
  • No other changes are necessary.

Fixing Links Without an Icon

If your existing links do not have an icon and you want to add one, paste the SVG icon on the same line after the opening <a> tag. Ensure the code remains in one line to avoid unwanted formatting issues in Markdown.

1
<svg width="1em" height="1em" viewBox="0 0 30 32" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill="none" stroke="#098f67" style="stroke: var(--color1, #098f67)" stroke-linejoin="miter" stroke-linecap="round" stroke-miterlimit="4" stroke-width="2.4156" d="M17.289 17.305v0c-1.754 1.754-4.597 1.754-6.351 0l-7.76-7.759c-1.755-1.755-1.755-4.601 0-6.356v0c1.753-1.753 4.595-1.756 6.351-0.005l6.208 6.187"></path><path fill="none" stroke="#098f67" style="stroke: var(--color1, #098f67)" stroke-linejoin="miter" stroke-linecap="round" stroke-miterlimit="4" stroke-width="2.4156" d="M12.504 13.97v0c1.754-1.754 4.597-1.754 6.351 0l7.762 7.762c1.754 1.754 1.754 4.597 0 6.351v0c-1.754 1.754-4.597 1.754-6.351 0l-5.953-5.953"></path></svg>
copy
Var alt klart?

Hvordan kan vi forbedre det?

Tak for dine kommentarer!

Sektion 4. Kapitel 1

Spørg AI

expand

Spørg AI

ChatGPT

Spørg om hvad som helst eller prøv et af de foreslåede spørgsmål for at starte vores chat

Suggested prompts:

How can I add this SVG icon to an existing link in my Markdown?

Can I change the color or size of the SVG icon?

What should I do if the icon doesn't display correctly in my Markdown?

Awesome!

Completion rate improved to 1.22

bookLink in a Text

Stryg for at vise menuen

Element

Some text before the link Python 3.13.2 documentation Some text after the link.

Source Code

index.html

index.html

copy

Readme

A simple, reusable HTML link that includes an inline SVG icon. It allows the link's destination (href attribute) to be customized and display text without making other changes.

Usage in Markdown

When using this HTML inside a Markdown block, ensure that the code is written in one line to avoid formatting issues. ChatGPT can help format the code properly.

Example

<a href="https://docs.python.org/3.13/" target="_blank"><svg width="1em" height="1em" viewBox="0 0 30 32" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill="none" stroke="#098f67" style="stroke: var(--color1, #098f67)" stroke-linejoin="miter" stroke-linecap="round" stroke-miterlimit="4" stroke-width="2.4156" d="M17.289 17.305v0c-1.754 1.754-4.597 1.754-6.351 0l-7.76-7.759c-1.755-1.755-1.755-4.601 0-6.356v0c1.753-1.753 4.595-1.756 6.351-0.005l6.208 6.187"></path><path fill="none" stroke="#098f67" style="stroke: var(--color1, #098f67)" stroke-linejoin="miter" stroke-linecap="round" stroke-miterlimit="4" stroke-width="2.4156" d="M12.504 13.97v0c1.754-1.754 4.597-1.754 6.351 0l7.762 7.762c1.754 1.754 1.754 4.597 0 6.351v0c-1.754 1.754-4.597 1.754-6.351 0l-5.953-5.953"></path></svg> Python 3.13.2 documentation</a>

Customization

  • Change the href attribute to point to the desired URL;
  • Modify the text inside the <a> tag to provide relevant information about the link;
  • No other changes are necessary.

Fixing Links Without an Icon

If your existing links do not have an icon and you want to add one, paste the SVG icon on the same line after the opening <a> tag. Ensure the code remains in one line to avoid unwanted formatting issues in Markdown.

1
<svg width="1em" height="1em" viewBox="0 0 30 32" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill="none" stroke="#098f67" style="stroke: var(--color1, #098f67)" stroke-linejoin="miter" stroke-linecap="round" stroke-miterlimit="4" stroke-width="2.4156" d="M17.289 17.305v0c-1.754 1.754-4.597 1.754-6.351 0l-7.76-7.759c-1.755-1.755-1.755-4.601 0-6.356v0c1.753-1.753 4.595-1.756 6.351-0.005l6.208 6.187"></path><path fill="none" stroke="#098f67" style="stroke: var(--color1, #098f67)" stroke-linejoin="miter" stroke-linecap="round" stroke-miterlimit="4" stroke-width="2.4156" d="M12.504 13.97v0c1.754-1.754 4.597-1.754 6.351 0l7.762 7.762c1.754 1.754 1.754 4.597 0 6.351v0c-1.754 1.754-4.597 1.754-6.351 0l-5.953-5.953"></path></svg>
copy
Var alt klart?

Hvordan kan vi forbedre det?

Tak for dine kommentarer!

Sektion 4. Kapitel 1
some-alt