The community is working on translating this tutorial into Croatian, but it seems that no one has started the translation process for this article yet. If you can help us, then please click "More info".
Attributes
A lot of the HTML5 elements can have attributes. The attribute provides additional information about the specific element, and they are always specified in the opening tag. Here’s an example – let’s say you want to create a link. The link element is specified by the <a> tag and the destination-address is specified in the href-attribute.
<a href="http://www.myurl.com">This is a link</a>As you can see, the link-element consists of the opening tag <a> and the closing tag </a>. The content of the link-element is "This is a link". But inside the opening tag is an attribute, href. The href-attribute always has a value, in this case http://www.myurl.com. Every time you have an element with an attribute, the pattern for writing attributes are attribute="value".
Here you have to note, that the attribute name is followed by a = and the value of the attribute is always surrounded by "". In HTML5 you can actually omit the quotation marks as long as the value doesn’t include a restricted character (such as >, =, or a space), but this increases the risk of errors – let’s look at the image-element to exemplify this.
<img src="my-puppy.jpg" alt="This is a picture of my puppy, Bob">If you look at the alt-attribute (alt is an abbreviation of alternate text) there is several words. This is no problem when you are using quotation marks – the quotation marks indicate that everything in between is the value of the alt-attribute. But because space is a restricted character you cannot write it like this:
<img src="my-puppy.jpg" alt=This is a picture of my puppy, Bob>If you did, the browsers would presume the value of the alt-attribute to be just "this" and the rest of your intended alt-text ("a picture of my puppy, Bob") could break the rest of your page.
What you have learned
- Some HTML elements can have attributes
- The pattern for an attributes is attribute="value"
- Attributes provide additional information about an element
- Attributes are always specified in the start tag
- You don’t have to use the quotation marks, but it is a really good idea
Hopefully you understand the basics of HTML by now, and therefore we are ready more forward to your first real webpage, which we will look at in the next chapter.
