Oops! It appears that you have disabled your Javascript. In order for you to see this page as it is meant to appear, we ask that you please re-enable your Javascript!

The alt, href, source and style  attributes in HTML

 The alt, href, source and style  attributes in HTML

In this tutorial, we will learn about the followings;

  1. HTML Attributes
  2. Quotes Attributes in HTML
  3. Quotes contain space Attributes in HTML
  4. Single or Double Quotes Attributes in HTML
  5. The Alt Attribute in HTML
  6. The href Attribute in HTML
  7. The src Attribute
  8. The style Attribute
  9. The Title Attribute in HTML
  10. Width and Height Attributes in HTML

HTML Attributes

HTML elements can have the attributes. Attributes are the properties for a specific HTML element.
Attributes provide detailed information about an element.
Attributes are always specified in the start tag represented by < >.
Every attribute must have a value. For example, see the mentioned font element.
<font color=”red”>this is font</font>
In this example, the font is the HTML element color is the attribute of the font and red is the value of the font element.

Quotes Attributes in HTML

Href is the attribute and it is double quoted. The values of href attribute is “https://www.t4tutorials.com”.

<html>
<body><h1>Welcome To T4-Tutorials</h1><h2>Quote Attribute Values:</h1><a href=”https://www.t4tutorials.com”>T4-Tutorials</a>

</body>
</html>

Quotes contain space Attributes in HTML

We cannot apply quotes around an attribute value, if the value contains spaces.It is recommended to use the quotation around the value of the attributes.

<html>
<body><h1>Welcome To T4-Tutorials</h1><h2>Quotes:</h2><p title=Welcome To T4-Tutorials>

We cannot apply <b>quotes around an attribute value<b/>
if the value contains spaces……

</p>

<p><b>
Thanks For Your Love For T4-Tutorials…….
</b></p>

</body>
</html>

Single or Double Quotes Attributes in HTML

Double quotes around attribute values are the most commonly in HTML, but single quotes are also allowed to use. Sometimes, when the attribute value itself contains double quotes, then it is mandatory to use single quote.

<html>
<body><h1>Welcome To T4-Tutorials</h1><h2>Quotes:</h2><p title=Welcome To T4-Tutorials>

We cannot apply <b>quotes around an attribute value<b/>
if the value contains spaces……

</p>

<p><b>
Thanks For Your Love For T4-Tutorials…….
</b></p>

</body>
</html>

The href Attribute in HTML

HTML links must be in <a> tag. The URL of the page is specified in the href

<html>
<body><h1>Welocome To T4-Tutorials</h1><h2>The href Attribute:</h2><p>HTML links are defined with the a tag……</p>

<a href=”https://t4tutorials.com/html”/>HTML</a>

<a href=”https://t4tutorials.com/css-tutorials/”>CSS</a>

</body>
</html>

The src Attribute

In this example img is the HTML element for putting images on the web page. The src, width, and height are the attributes of the image. Here, jpg, 300 and 100 are values of the attribute. 

<html>
<body><h1>Welcome To T4-Tutorials</h1><h2>The src Attribute:</h2><p>Thanks For your Love For T4-tutorials..</p>

<img src=”logo.jpg” width=”300″ height=”100″>

</body>
</html>

The style Attribute

We can apply a style on any of the HTML element.

We can add a title attribute to the paragraph elements. The value of the title attribute will be displayed as a tooltip when you mouse over theh1, h2, and p.

The Title Attribute in HTML

<html>
<body><h2>The style Attribute:</h2><p>It is used to specify the styling of an element, like color:</p><p style=”color:purple”>Thanks For Your Love For T4-Tutorials…</p>

</body>
</html>

Width and Height Attributes in HTML

We can assign src of the image. The source can be any URL. Width and Height can be applied on the image to see the image according to your desired size.

<html>
<body><h2>Size Attributes:</h2>
<p>Thanks For Your Love For T4-Tutorials..</p><img src=”logo.jpg” width=400″ height=”100″></body>
</html>
Fazal Rehman Shamil Click Here to Know More
Instructor, Researcher, Blogger, SEO Expert, Poet and Publisher of International Journal Of Software, Technology & Science ISSN : 2616 - 5325
Dear Professors and Resarchers!You are welome to Cite these tutorials in your research or slides etc. Please don't forget to mention the reference of website. Copy Paste of text is strcitly forbidden. Images can be reuse because images are protected with watermark.

Leave a Reply

Your email address will not be published. Required fields are marked *