get image| video | audio | lists

In this lecture we will learn how to get images from local database and from online sources, also we gonna learn about getting videos , how to refer the other websites .

Also we will set the height and width of the images.

Lists: They are used to organize and present information in a structured manner

They are mainly of three types

Ordered lists. <ol>

2. Unordered lists. <ul>

Definition lists. <dl>

below programme will demonstrate it:

href : hyperlink or reference.

target : means open in new tab.

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8" />
  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  <meta name="viewport" content="width=\, initial-scale=1.0" />
  <title>BLOCK AND TITLE</title>
</head>

<body>

<!--  Getting Image -->
  <img src="4.jpg" alt="error 404" height="300px" width="240px" title="beauty" />
  <br />

    <!--   lists-->
  <!-- ordered list and types      -->
  <ol>
    <li type="i">one</li>
    <li type="I"></li>
    <li type="A">three</li>
    <li>four</li>
    <li></li>
    <li></li>
    <li></li>
  </ol>

  <!-- unordered list (default : disc)-->
  <ul>
    <li>one</li>
    <li>two</li>
    <li>three</li>
    <li></li>
    <li></li>
  </ul>
  <!-- unordered list and types -->
  <ul>
    <li type="circle"></li>
    <li type="square"></li>
    <li type="none"></li>
    <li type="disc"></li>
    <li></li>
  </ul>


  <!-- description list dl -->
  <dl>
    <!-- dt : description term -->
    <dt>samsung s22 ultra</dt>
     <!-- dd : description data-->
    <dd>this is good phone</dd>
  </dl>

  <!-- INTERLINKING -->
  <a href="https://www.google.co.in/" target="_blank">google</a>
  <!-- target : means open in new tab -->

  <a href="hello.html" target="_blank">same site</a>
  <a href="mailto:abc@gmail.com">mail</a>
  <a href="DATA_STRUCTURE_57421_GOPAL_KRISHNA_DWIVEDI_.docx" download>downlaod</a>
  <br />



  <!-- getting video in page -->

  <h1>loading video</h1>
  <video
    src="https://player.vimeo.com/external/539554529.sd.mp4?s=d52f9e53361b09b9a7a33e1552ef99605cc9041b&profile_id=165&oauth2_token_id=57447761"
    controls autoplay muted height="600px" width="350px">if video not loaded</video>

  <!-- method 2 -->

  <!--  we can give more than one video source in it as if one source fails then we can get the other source -->
  <video controls>
    <source
      src="https://player.vimeo.com/external/542319125.hd.mp4?s=25eba1823a55cc12df64b9a6d9619b9efc4200a0&profile_id=174&oauth2_token_id=57447761" height="200px" width="300px"/>
    <source src="https://www.pexels.com/video/an-elevated-highway-in-the-mountain-valley-in-hawaii-3629511/" height="300px" width="300px" />


  <!-- getting an audio on page -->
  <h2>audio</h2>
  <audio src="" controls autoplay muted></audio>

</body>

</html>

lt.7 : https://hashnode.com/post/clnx1prb7000209mh5s12guv0

Get image , video ,audio, interlinks ,lists (lt.8)

Did you find this article valuable?