x
<html><title>W3.CSS</title><meta name="viewport" content="width=device-width, initial-scale=1"><link rel="stylesheet" href="4/w3.css"><body><div class="w3-container"> <h2>Tabbed Image Gallery</h2> <p>Click on the images below:</p></div><div class="w3-row-padding"> <div class="w3-col s3 w3-container"> <a href="javascript:void(0)" class="w3-hover-opacity" onclick="openImg('Nature');"> <img src="img_nature.jpg" alt="Nature" style="width:100%"> </a> </div> <div class="w3-col s3 w3-container"> <a href="javascript:void(0)" class="w3-hover-opacity" onclick="openImg('Snow');"> <img src="img_snowtops.jpg" alt="Snow" style="width:100%"> </a> </div> <div class="w3-col s3 w3-container"> <a href="javascript:void(0)" class="w3-hover-opacity" onclick="openImg('Mountains');"> <img src="img_mountains.jpg" alt="Mountains" style="width:100%"> </a> </div> <div class="w3-col s3 w3-container"> <a href="javascript:void(0)" class="w3-hover-opacity" onclick="openImg('Lights');"> <img src="img_lights.jpg" alt="Lights" style="width:100%"> </a> </div></div><br><div id="Nature" class="picture w3-display-container" style="display:none"> <img src="img_nature_wide.jpg" alt="Nature" style="width:100%"> <span onclick="this.parentElement.style.display='none'" class="w3-display-topright w3-button w3-transparent w3-text-white">×</span> <div class="w3-display-bottomleft w3-container w3-padding w3-text-white">Nature</div></div><div id="Snow" class="picture w3-display-container" style="display:none"> <img src="img_snow_wide.jpg" alt="Snow" style="width:100%">