Link

Link

Used to create a hyperlink to another location.

Variants

Default

You can add links to any text

Lorem ipsum dolor sit amet, consectetur adipiscing elit. In condimentum nisl sed dolor consectetur, vitae hendrerit nulla ullamcorper. Sed quis massa mi. Etiam sed ullamcorper est. Phasellus sodales tempus sapien et tristique. Praesent non mauris sem. Aliquam leo elit, molestie sed eros ac, sodales mattis metus. Cras imperdiet est vel quam faucibus posuere. Praesent quis felis mattis, dapibus nibh ut, porttitor dui. Curabitur in eleifend tortor, vel fermentum enim. Etiam blandit quam neque, quis pretium lorem finibus pharetra. Aliquam a placerat arcu. Sed at nibh et nulla ullamcorper pharetra ac ac tortor. Nullam arcu justo, vulputate et efficitur ut, finibus sit amet leo. Phasellus non sem id sapien gravida sodales et at leo.

States

This component has only the default state.

Using this component

  1. Confirm that you have references to Fabric's CSS on your page:
     <head>
         <link rel="stylesheet" href="fabric.min.css">
         <link rel="stylesheet" href="fabric.components.min.css">
     </head>
    
  2. Copy the HTML from one of the samples above into your page. For example:
     <div class="ms-font-m">
         <a href="#" class="ms-Link">Link to a webpage</a>
     </div>
    
  3. Replace the sample text with the text of your link.

Dependencies

This component has no dependencies on other components.

Accessibility

Use the title attribute to provide additional text describing the link, if the link text itself is not descriptive enough.

Notes

The Link inherits the font family, size, and weight of its parent element. This is why we have placed it within .ms-font-m wrapper in the sample above.