Link
Component for links
The <Link>
component creates a hyperlink to web pages, files, email addresses, locations in the same page, or anything else a URL can address.
The href
property is required. Additional you can set the target
property.
Import
import { Link } from '@marigold/components';
Apperance
Property | Type | Description |
---|---|---|
variant | menuItemLink | content | The available variants of this component. |
size | - | The available sizes of this component. |
Props
Property | Type | Default | Description |
---|---|---|---|
href | string | - | Hypertext Reference for your link. |
target | _blank | - | The response is displayed in a new window or tab. |
download | string | - | The download attribute specifies that the target (the file specified in the href attribute) will be downloaded when a user clicks on the hyperlink. |
disabled | boolean | false |
Examples
Standard Link
The example shows a standard <Link>
.
Preview
Code
Link something nice like Marigold
Link disabled
This example shows a <Link>
component with the prop disabled
.
Preview
Code
You can jump to reservix.de
Anchor Link
This is an example of using an anchor link on the web page. If you want to use an anchor link, you must give the target the same ID (without #) as the href property in the link
Preview
Code
Jump to Import
Link with target
An example of using the target
_blank
property. When the target is blank, the web page opens in a new tab.
Preview
Code
Link something nice like Marigold github repositories