HTML5系列代码:个人网站-画廊

    技术2025-12-10  10

    <!DOCTYPE html> <!--[if (gte IE 9)|!(IE)]><!--><html lang="en"> <!--<![endif]--> <head> <!-- Basic Page Needs ================================================== --> <meta charset="utf-8"> <title>zBabyCare</title> <meta name="description" content="Free Responsive Html5 Css3 Templates "> <!-- Mobile Specific Metas ================================================== --> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> <!-- CSS ================================================== --> <link rel="stylesheet" href="css/zerogrid.css"> <link rel="stylesheet" href="css/style.css"> <link rel="stylesheet" href="css/lightbox.css"> <!-- Custom Fonts --> <link href="font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css"> <link rel="stylesheet" href="css/menu.css"> <script src="js/jquery1111.min.js" type="text/javascript"></script> <script src="js/script.js"></script> </head> <body> <div class="wrap-body"> <div class="header"> <div id='cssmenu' > <ul> <li><a href='index.html'><span>zBabyCare</span></a></li> <li class=' has-sub'><a href='#'><span>Category</span></a> <ul> <li class='has-sub'><a href='#'><span>Item 1</span></a> <ul> <li><a href='#'><span>Sub Item</span></a></li> <li class='last'><a href='#'><span>Sub Item</span></a></li> </ul> </li> <li class='has-sub'><a href='#'><span>Item 2</span></a> <ul> <li><a href='#'><span>Sub Item</span></a></li> <li class='last'><a href='#'><span>Sub Item</span></a></li> </ul> </li> </ul> </li> <li class="active"><a href='gallery.html'><span>Gallery</span></a></li> <li><a href='single.html'><span>About</span></a></li> <li class='last'><a href='contact.html'><span>Contact</span></a></li> </ul> </div> </div> <!--Container--> <section id="container"> <div class="wrap-container clearfix"> <div id="main-content"> <div class="wrap-content" style="padding-top: 50px;"> <div class="zerogrid"> <div class="row"> <div class="col-1-4"> <div class="zoom-container"> <a class="example-image-link" href="images/5.jpg" data-lightbox="example-set" data-title="Click the right half of the image to move forward."> <span class="zoom-caption"> <h3>Lorem ipsum</h3> </span><img class="example-image" src="images/5.jpg" alt=""/> </a> </div> <div class="zoom-container"> <a class="example-image-link" href="images/7.jpg" data-lightbox="example-set" data-title="Click the right half of the image to move forward."> <span class="zoom-caption"> <h3>Lorem ipsum</h3> </span><img class="example-image" src="images/7.jpg" alt=""/> </a> </div> <div class="zoom-container"> <a class="example-image-link" href="images/8.jpg" data-lightbox="example-set" data-title="Click the right half of the image to move forward."> <span class="zoom-caption"> <h3>Lorem ipsum</h3> </span><img class="example-image" src="images/8.jpg" alt=""/> </a> </div> </div> <div class="col-1-4"> <div class="zoom-container"> <a class="example-image-link" href="images/7.jpg" data-lightbox="example-set" data-title="Click the right half of the image to move forward."> <span class="zoom-caption"> <h3>Lorem ipsum</h3> </span><img class="example-image" src="images/7.jpg" alt=""/> </a> </div> <div class="zoom-container"> <a class="example-image-link" href="images/8.jpg" data-lightbox="example-set" data-title="Click the right half of the image to move forward."> <span class="zoom-caption"> <h3>Lorem ipsum</h3> </span><img class="example-image" src="images/8.jpg" alt=""/> </a> </div> <div class="zoom-container"> <a class="example-image-link" href="images/6.jpg" data-lightbox="example-set" data-title="Click the right half of the image to move forward."> <span class="zoom-caption"> <h3>Lorem ipsum</h3> </span><img class="example-image" src="images/6.jpg" alt=""/> </a> </div> </div> <div class="col-1-4"> <div class="zoom-container"> <a class="example-image-link" href="images/5.jpg" data-lightbox="example-set" data-title="Click the right half of the image to move forward."> <span class="zoom-caption"> <h3>Lorem ipsum</h3> </span><img class="example-image" src="images/5.jpg" alt=""/> </a> </div> <div class="zoom-container"> <a class="example-image-link" href="images/6.jpg" data-lightbox="example-set" data-title="Click the right half of the image to move forward."> <span class="zoom-caption"> <h3>Lorem ipsum</h3> </span><img class="example-image" src="images/6.jpg" alt=""/> </a> </div> <div class="zoom-container"> <a class="example-image-link" href="images/7.jpg" data-lightbox="example-set" data-title="Click the right half of the image to move forward."> <span class="zoom-caption"> <h3>Lorem ipsum</h3> </span><img class="example-image" src="images/7.jpg" alt=""/> </a> </div> </div> <div class="col-1-4"> <div class="zoom-container"> <a class="example-image-link" href="images/8.jpg" data-lightbox="example-set" data-title="Click the right half of the image to move forward."> <span class="zoom-caption"> <h3>Lorem ipsum</h3> </span><img class="example-image" src="images/8.jpg" alt=""/> </a> </div> <div class="zoom-container"> <a class="example-image-link" href="images/7.jpg" data-lightbox="example-set" data-title="Click the right half of the image to move forward."> <span class="zoom-caption"> <h3>Lorem ipsum</h3> </span><img class="example-image" src="images/7.jpg" alt=""/> </a> </div> <div class="zoom-container"> <a class="example-image-link" href="images/5.jpg" data-lightbox="example-set" data-title="Click the right half of the image to move forward."> <span class="zoom-caption"> <h3>Lorem ipsum</h3> </span><img class="example-image" src="images/5.jpg" alt=""/> </a> </div> </div> </div> </div> </div> </div> </div> </section> <hr class="line"> <!--Footer--> <footer> <div class="wrap-footer"> <div class="zerogrid"> <div class="row"> <div class="col-1-3"> <div class="wrap-col"> <p>Copyright &copy; 2019.Company name All rights reserved.<a target="_blank" href="http://www.programb.com/">&#x7F51;&#x9875;&#x6A21;&#x677F;</a></p> </div> </div> <div class="col-1-3"> <div class="wrap-col"> <ul class="social-buttons"> <li><a href="#"><i class="fa fa-twitter"></i></a> </li> <li><a href="#"><i class="fa fa-facebook"></i></a> </li> <li><a href="#"><i class="fa fa-linkedin"></i></a> </li> </ul> </div> </div> <div class="col-1-3"> <div class="wrap-col"> <ul class="quick-link"> <li><a href="#">Privacy Policy</a></li> <li><a href="#">Terms of Use</a></li> </ul> </div> </div> </div> </div> </div> </footer> </div> <script src="js/lightbox-plus-jquery.min.js"></script> </body> </html>

    Processed: 0.009, SQL: 9