HTML IMAGE

HTML LIST

Images help to bring visual illustration and interaction with web users. Images can improve the design and the appearance of a web page.

Images tags and Attributes

    In HTML 5, img tags is use instead of image tags, The <img> tag is empty, it contains attributes only, and does not have a closing tag. The <img> tag has two required attributes:

  • src - Specifies the path (URL) to the image
  • alt - Specifies an alternate text for the image

Example

    •       
    <img src = "/html/images/test.png" alt = "Test Image" />

    Image Size - Width and Height

      You can use the width and height attribute to specify the width and height of an image. The width and height attributes always define the width and height of the image in pixels.

    Example

    •       
<!DOCTYPE html>
<html>
<head>
<style>
img {
  width: 100%;
}
</style>
</head>
<body>

<img src="html5.gif" alt="HTML5 Icon" width="128" height="128">

<img src="html5.gif" alt="HTML5 Icon" style="width:128px;
height:128px;">

</body>
</html>

    Images in Another Folder

      If you have your images in a sub-folder, you must include the folder name in the src attribute:

    Example

    •       
 
   <img src="/images/html5.gif" alt="HTML5 Icon">

    Common Image Formats

      Here are the most common image file types, which are supported in all browsers (Chrome, Edge, Firefox, Safari, Opera):

    • src - APNG: its acronym of Animated Portable Network Graphics, it file extension is .apng
    • GIF: its acronym of Graphics Interchange Format, it file extension is .gif
    • ICO: its acronym of Microsoft Icon, it file extension is .ico, .cur
    • GIF: its acronym of Graphics Interchange Format, it file extension is .gif
    • GIF: its acronym of Graphics Interchange Format, it file extension is .gif
    • GIF: its acronym of Graphics Interchange Format, it file extension is .gif

    Popular tags

    HTML Forms HTML Table HTML List HTML Video HTML Image

    Dess App

    DessApp is an Integrated E-learning Education, Interactive and User-friendly features, smarter options and redefining your school costs effectively and efficiently.

    View
    1 1