Daily #Vlog with Anik || CSS Image Gallery || CSS Properties

In this video,I explained the CSS Image Gallery. Feel free to comment. For more, please subscribe and press the BELL icon.Please visit my CSS Playlist. Please link, comment, share and subscribe. The code is as follows -

HTML File - 
<html>
  <head> <title> Image Gallery </title>
         <link rel="stylesheet" href="image_gallery.css">
  </head>
 
  <body>
    <div class="imggallery">
  <a href="html.png" target="_blank">
    <img src="html.png" alt="HTML Image" width=150 height=150>
  </a>
<div class="note"> Added a HTML Image </div>
</div>

<div class="imggallery">
  <a href="css.png" target="_blank">
    <img src="css.png" alt="CSS Image" width=150 height=150>
  </a>
<div class="note"> Added a CSS Image </div>
</div>

<div class="imggallery">
  <a href="htmlcss.png" target="_blank">
    <img src="htmlcss.png" alt="HTML Image" width=120 height=100>
  </a>
<div class="note"> Added a HTML and CSS Image </div>
</div>

  </body>
</html>

CSS File - 
div.imggallery {
margin:5px;
border: 1px solid gray;
float: left;
width: 150px;
}

div.imggallery img {
width: 100%;
height: auto;
}

div.note{
padding: 15px;
text-align: center;
}

div.imggallery:hover {
border: 1px solid black;
}


Comments

Post a Comment

Popular posts from this blog

Alert Dialog Box in JS || JavaScript Dialog Box

Image
In this video,I explained the Alert Dialog Box . Feel free to comment. For more, please subscribe and press the BELL icon. The code is as follows - HTML File -  <html>  <head> <title> Alert Dialog Box in JS </title> </head>  <!--  JS - Dynamic web pages        <script>    </script>    Interaction with the users    <head>   </head>       <body>    </body>    JS - Dialog boxes - alert, confirm and prompt        -->  <body>    <script language="javascript">      alert("Hi Everyone ...!!!");      document.write("<h1> Hello..!!! Welcome to my </h1> "+ "<b> channel </b>");    </script>  </body>  </html>
Read more

HTML - Frameset Tag in html

Image
Hello everyone. In this video, I explained the frameset tag in html -  HTML - Frameset Tag in html . For more, please subscribe the channel. If you have any doubt, please comment in this video. Check my playlist -  HTML Playlist Please like, comment, share and subscribe.
Read more

Indian Flag || Indian Flag using HTML CSS

Image
In this video,I explained how to create Indian Flag using HTML CSS . Feel free to comment. For more, please subscribe and press the BELL icon. Please visit my  Angular Playlist . Please visit my  YouTube Videos . The code is as follows - HTML File - <html>   <head>      <title> Indian Flag </title>      <link rel="stylesheet" href="flag.css">   </head>   <body>      <div class="flag">     <div class="stripe stripe1"> </div>   <div class="stripe stripe2">      <div class="chakra">     <div class="spoke spoke1"> </div> <div class="spoke spoke2"> </div> <div class="spoke spoke3"> </div> <div class="spoke spoke4"> </div> <div class="spoke spoke5"> </div> <div class="spoke spoke6"> </d
Read more