Earn income with your HTML skills
Sign up and we'll send you the best freelance opportunities straight to your inbox.
We're building the largest freelancing marketplace for people like you.
A style attribute on an <a> (anchor) tag assigns a unique style to the link.
Its value is CSS that defines the appearance of the anchor element.
Example
#
A style attribute on an <a> tag.
The link looks like a button.
<a style="background-color: navy; color: white; padding: 7px 10px; " target="_blank" href="https://microsoft.com">Microsoft</a>
Using style
The style attribute specifies the style, i.e. look and feel, of the <a> element.
A style contains any number of CSS property/value pairs, separated by semicolons (;).
The style attribute overrides any other style that was defined in a <style> tag or an external CSS file.
This inline styling affects the current <a> element only.
Syntax
<a style="CSS-styles">
Values
#
Value | Description |
---|---|
CSS-styles | One or more CSS property/value pairs separated by semicolons (;). |
More Examples
A style attribute on an <a> tag.
Clicking the button toggles the background color.
<a id="mylink" style="background-color: navy; color: white; padding: 7px 10px; " target="_blank" href="https://microsoft.com">Microsoft</a><br /><br /><button onclick="toggle();">Toggle style</button><script> let toggle = () => { let element = document.getElementById("mylink"); if (element.style.backgroundColor === "navy") { element.style.backgroundColor = "slateblue"; } else { element.style.backgroundColor = "navy"; } }</script>
Code explanation
The style attribute assigns a background color to the <a> element.
Clicking the button calls JavaScript which changes the background color of the link.
Browser support
Here is when style support started for each browser:
Chrome | 1.0 | Sep 2008 |
Firefox | 1.0 | Sep 2002 |
IE/Edge | 1.0 | Aug 1995 |
Opera | 1.0 | Jan 2006 |
Safari | 1.0 | Jan 2003 |
You may also like
Last updated on Sep 30, 2023
Earn income with your HTML skills
Sign up and we'll send you the best freelance opportunities straight to your inbox.
We're building the largest freelancing marketplace for people like you.
Guides
On this page
- style Attribute
- Example
- Using style
- Syntax
- Values
- More Examples
- Browser support
- You may also like