index.html

<!DOCTYPE html>
<html lang="en">
    <!--This is an HTML document to link the external stylesheet (CSS file) and
    Script File (JS File) inside the HTML document. -->
    <head>

        <!--The meta tag defines metadata about an HTML Document. Metadata is
        information about data.
        Meta Tags are snippets of text that describe a page's content. The 
        meta tags dont appear on the page itself but only in the page's source 
        code. 
        Meta tags are essentially little content descriptors that help tell 
        search engines what a web page is about.--> 


        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width. initial-scale=1.0">
        <title>Image Slider</title>
        <link rel="stylesheet" href="Style.css">
    </head>
    <body>

        <script src="script.js"></script>

        <!--Creating background for the slider i.e. creating a box using HTML 
        and CSS-->

        <!--A div is a container tag that is used to define a division or a section 
        in an HTML document, whereas a class is an attribute that specifies actions 
        to be taken to one or more elements.-->

        <!--Adding Image-->
        <div class="slider"> 
            <div id="img"></div>
            <!--The id attribute is used to label sections or parts of your HTML
             document.-->
             <img src=>
        </div>
        <div class="slider">
            <div id="img">
                <img src='https://cdn.forcast.com.au/media/webp_image/wysiwyg/JUL5_MAIN_MOBILE.webp3'>
            </div>
        </div>
        <div class="slider">
            <div id="img">
                <img src='https://i.pinimg.com/originals/b6/a8/42/b6a8429f8097c52d13081dece51b544a.jpg'>
            </div>
        </div>
        <div class="slider">
            <div id="img">
                <img src='https://i5.walmartimages.com/asr/49449dc5-f0d7-4bb2-9664-77072f33fcc9.0d62633a014df1006e4d5b6830005204.jpeg?odnHeight=612&odnWidth=612&odnBg=FFFFFF'>
            </div>
        </div>
        <div class="slider">
            <div id="img">
                <img src='https://cdn.forcast.com.au/media/webp_image/wysiwyg/JUL5_MAIN_MOBILE.webp'>
            </div>
        </div>
        
        
    </body>
</html>