HTML5系列代码:个人网站-服务页面

    技术2025-12-22  15

    <!DOCTYPE html> <html lang="en"> <head> <title>Home</title> <meta charset="utf-8"> <meta name="author" content=""> <link rel="stylesheet" type="text/css" href="css/reset.css"> <link rel="stylesheet" type="text/css" href="css/main.css"> <script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript" src="js/main.js"></script> </head> <body> <section class="billboard"> <header> <div class="wrapper"> <a href="#"><img src="img/logo.png" class="h_logo" alt="" title=""></a> <nav> <ul class="main_nav"> <li class="current"><a href="#">Home</a></li> <li><a href="#">Services</a></li> <li><a href="#">About Us</a></li> <li><a href="#">Blog</a></li> <li><a href="#">Contact Us</a></li> </ul> </nav> </div> </header> <section class="caption"> <p class="cap_title">Excepteur occaecat cupidatat</p> <p class="cap_desc">duis aute irure reprehenderit</p> </section> </section><!-- Billboard End --> <section class="services wrapper"> <div class="S_icons"> <img src="img/S1.png" alt="" title=""/> <hr class="sp"/> <img src="img/S2.png" alt="" title=""/> <hr class="sp"/> <img src="img/S3.png" alt="" title=""/> </div> <ul class="desc"> <li> <h3>Duis Aute Irure</h3> <p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur Excepteur.</p> </li> <li> <h3>Duis Aute Irure</h3> <p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur Excepteur.</p> </li> <li> <h3>Duis Aute Irure</h3> <p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur Excepteur.</p> </li> </ul> </section><!-- services End --> <section class="call_to_action"> <div class="wrapper"> <img src="img/cta_image.png" alt="" title=""> <section class="cta_desc"> <h3>We Design Beautiful Templates.</h3> <p>We Design Beautiful Templates.Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore euna fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in pel culpa qui officia deserunt mollit anim id est laborum.</p> <a href="#" class="cta_btn">Sign Up Now!</a> </section> </div> </section><!-- call_to_action End --> <section class="client_testimonials"> <div class="wrapper"> <h3>Our Happy Clients.</h3> <section class="testimonials"> <blockquote>Fenim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</blockquote> </blockquote>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.</blockquote> <a href="" target="_blink" class="author">@Jane Doe</a> <img class="avatar" src="img/author.jpg" title="" atl=""/> </section> <section class="testimonials"> <blockquote>Fenim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</blockquote> </blockquote>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.</blockquote> <a href="" target="_blink" class="author">@Jane Doe</a> <img class="avatar" src="img/author2.jpg" title="" atl=""/> </section> <section class="testimonials"> <blockquote>Fenim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</blockquote> </blockquote>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.</blockquote> <a href="#" target="_blink" class="author">@Jane Doe</a> <img class="avatar" src="img/author3.jpg" title="" atl=""/> </section> </div> </section><!-- testimonials End --> <section class="newsletter"> <div class="wrapper"> <p>subscribe to our newsletter.</p> <form method="" action="" class="sub_form"> <input type="text" id="" class="email_field" placeholder="name"> <input type="text" id="" class="name_field" placeholder="email"> <input type="submit" id="" class="submit_nl" value="Subscribe"> </form> </div> </section><!-- newsletter End --> <footer> <img src="img/footer_logo.png" alt="" title=""> <nav> <ul> <li><a href="#">Company</a></li> <li><a href="#">Location</a></li> <li><a href="#">Help</a></li> <li><a href="#">Advertise</a></li> <li><a href="#">Terms</a></li> <li><a href="#">Privacy</a></li> </ul> </nav> <hr class="footer_sp"/> <p class="rights">Copyright &copy; 2019.Company name All rights reserved.<a target="_blank" href="http://www.programb.com/">&#x7F51;&#x9875;&#x6A21;&#x677F;</a></p> </footer><!-- footer End --> </body>

    Processed: 0.021, SQL: 9