HTML Tutorial

by Trainer Riad Thalji

Images



The src attribute



Examine this code for example:

<!doctype html>
<html>
<body>
<h1>Our Proposed Company Logo Design </h1>
<p>Following is our logo proposed design, we may make changes later: </p>
<img src="myimages/mylogo.jpg" />
<p>And this is our business card template that I'm going to use: </p>
<img src="myimages/mybusinesscard.jpg" />
<p>I stored the images mylogo.jpg and mybusinesscard.jpg in a folder called myimages in the same place where I saved this HTML page. </p>
</body>
</html>


The result will be:




The alt Attribute




In our previous example we could write the <img> tags in this better way:

<img src="myimages/mylogo.jpg" alt=”Thalji.net Logo” />

<img src="myimages/mybusinesscard.jpg" alt=”Thalji.net Business Card />



Image Alignment




Image Width and Height




In our example, let’s make the logo and business card larger and give them and alternative text, the code becomes like follows:

<!doctype html>
<html>
<body>
<h1>Our Proposed Company Logo Design </h1>
<p>Following is our logo proposed design, we may make changes later: </p>
<img src="myimages/mylogo.jpg" alt=”Thalji.net Logo” width="200px" height="200px" />
<p>And this is our business card template that I'm going to use: </p>
<img src="myimages/mybusinesscard.jpg" alt=”Thalji.net Business Card" width="350px" height="200px" />
<p>I stored the images mylogo.jpg and mybusinesscard.jpg in a folder called myimages in the same place where I saved this HTML page. </p>
</body>
</html>

The result is:




Join Our Coming PMP Prep Course
Special Offer:

JD 230

Delivered by Trainer

Riad Thalji



From the Video Library

How to Create Multi-Lingual Navbars in ASP.Net Core 2.1

How to Create Multi-Lingual Navbars in ASP.Net Core 2.1 | Advanced Programming Series | Riad Thalji

How to Create Multi-Lingual Navbars in ASP.Net Core 2.1

How to Quickly Import Data between Excel, Access and SQL Server

Project Management Office - PMO

Project Managemenet Office - PMO Crash Course

Project Management Office - PMO

How to Create Nested Layouts in ASP.Net Core 2.1 | Advanced Programming Series | Riad Thalji

Developed by Thalji.net, © Riad Thalji