How to link multiple images in sequence together using HTML-CodePudding

I'm trying to link a series of images together I know the basic HTML Code for linking 1 image to another would be

<!DOCTYPE html>
<html>
<head>
<body>
<!DOCTYPE html>
<html>
   <head>
      <title>HTML Image as link</title>
   </head>
   <body>
      <a href="Imagelink1">
         <img alt="" src="Imagelink2"
         
         >
      </a>
   </body>
</html>

But I'm trying to continue the chain from Imagelink2 to Imagelink3 to Imagelink4 and so on. How would I go about doing that?

CodePudding user response：

it's not possible to do that. You have to create a link for each image.

Example below:

<!DOCTYPE html>
<html>
   <head>
      <title>HTML Image as link</title>
   </head>
   <body>
      <a href="Imagelink1">
         <img src="Imagelink1" alt="">
      </a>
      <a href="Imagelink2">
         <img src="Imagelink2" alt="">
      </a>
      <a href="Imagelink3">
         <img src="Imagelink3" alt="">
      </a>
   </body>
</html>

CodePudding user response：

Is that what you're looking for?

img {
  display: block;
  width: 200px;
  height: 200px;
  margin: 0 auto 500px;
}

<!DOCTYPE html>
<html>

<head>

  <body>
    <!DOCTYPE html>
    <html>

    <head>
      <title>HTML Image as link</title>
    </head>

    <body>
      <a href="#img2">
        <img src="https://images.pexels.com/photos/674010/pexels-photo-674010.jpeg?cs=srgb&dl=pexels-anjana-c-674010.jpg&fm=jpg" id="img1" alt="" />
      </a>


      <a href="#img3">
        <img src="https://cdn.pixabay.com/photo/2015/04/23/22/00/tree-736885__480.jpg" id="img2" alt="" />
      </a>


      <a href="#img1">
        <img src="https://cdn.pixabay.com/photo/2014/02/27/16/10/flowers-276014__340.jpg" id="img3" alt="" />
      </a>
    </body>

    </html>