现代专业汽车美容维修服务网站#独立站网站建设 #bootstrap(Production of automobile beauty and repair service website)
黄菊华老师是技术教育专家，专注于前端开发和毕业设计指导。作为《Vue.js入门与商城开发实战》等畅销书作者，提供从入门到精通的视频课程，涵盖网站制作、小程序开发等领域。其特色服务包括：完整项目配套（代码、文档、演示视频）、毕业设计辅导（论文、答辩指导）、定制开发等。所有项目均包安装运行，适合学生和开发者学习实践。可通过CSDN博客联系获取详细资料。（98字）
·
博主介绍：黄菊华老师《Vue.js入门与商城开发实战》《微信小程序商城开发》图书作者，CSDN博客专家，在线教育专家，CSDN钻石讲师；专注网站制作、小程序开发、软件开发和大学生毕业设计教育、辅导。
所有项目都配有从入门到精通的基础知识视频课程，学习后应对毕业设计答辩，提供核心代码讲解，答辩指导。
项目配有对应开发文档、开题报告、任务书、PPT等，提供毕业设计论文辅导。项目都录了发布和功能操作演示视频；项目的界面和功能都可以定制，包安装运行！！！
如果需要联系我，可以在CSDN网站查询黄菊华老师的，在文章末尾可以获取联系方式
作品截图
核心代码
<!doctype html>
<html class="no-js" lang="zxx">
<head>
<meta charset="utf-8">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<title>Home One - Carspa</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="apple-touch-icon" href="img/apple-touch-icon.png">
<link rel="shortcut icon" type="image/x-icon" href="img/icon/favicon.ico">
<!-- Place favicon.ico in the root directory -->
<!-- all css here -->
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/font-awesome.min.css">
<link rel="stylesheet" href="css/meanmenu.min.css">
<link rel="stylesheet" href="css/venobox.css">
<link rel="stylesheet" href="css/material-design-iconic-font.min.css">
<link rel="stylesheet" href="css/magnific-popup.css">
<link rel="stylesheet" href="css/shortcode/shortcodes.css">
<link rel="stylesheet" href="css/plugins.css">
<link rel="stylesheet" href="style.css">
<link rel="stylesheet" href="css/responsive.css">
<script src="js/vendor/modernizr-2.8.3.min.js"></script>
</head>
<body>
<!--[if lt IE 8]>
<p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
<![endif]-->
<!-- Header Area Start -->
<header>
<!-- Header Top Menu Area Start -->
<div class="header-full-area">
<div class="header-top-area">
<div class="container">
<div class="row">
<div class="col-md-8 col-sm-8">
<div class="header-phone">
<p><i class="zmdi zmdi-phone"></i> 021 12312 - 127 12101</p>
</div>
</div>
<div class="col-md-4 col-sm-4">
<div class="header-social f-right">
<ul>
<li><a href="#"><i class="zmdi zmdi-facebook"></i></a></li>
<li><a href="#"><i class="zmdi zmdi-vimeo"></i></a></li>
<li><a href="#"><i class="zmdi zmdi-tumblr"></i></a></li>
<li><a href="#"><i class="zmdi zmdi-pinterest"></i></a></li>
<li><a href="#"><i class="zmdi zmdi-twitter"></i></a></li>
</ul>
</div>
</div>
</div>
</div>
</div>
<div class="header-bottom-area" id="sticky-header">
<div class="container">
<div class="header-bottom red-bg fix m-0">
<a href="index.html" class="logo f-left"><img src="img/icon/logo.png" alt=""></a>
<div class="main-menu text-center">
<nav>
<ul>
<li class="active"><a href="index.html">home</a></li>
<li><a href="about-us.html">about Us</a></li>
<li><a href="service.html">service</a></li>
<li><a href="news.html">latest news</a></li>
<li><a href="service-details.html">PAGES</a>
<ul>
<li><a href="service.html"><i class="zmdi zmdi-caret-right"></i>service</a></li>
<li><a href="service-details.html"><i class="zmdi zmdi-caret-right"></i>Service Details</a></li>
<li><a href="news.html"><i class="zmdi zmdi-caret-right"></i>latest news</a></li>
<li><a href="news-details.html"><i class="zmdi zmdi-caret-right"></i>News Details</a></li>
<li><a href="404.html"><i class="zmdi zmdi-caret-right"></i>404 Error</a></li>
</ul>
</li>
<li><a href="contact-us.html">contact us</a></li>
</ul>
</nav>
</div>
</div>
</div>
<!-- MOBILE-MENU-AREA START -->
<div class="mobile-menu-area">
<div class="container">
<div class="row">
<div class="col-md-12 col-sm-12">
<div class="mobile-area">
<div class="mobile-menu">
<nav id="mobile-nav">
<ul>
<li class="active"><a href="index.html">home</a></li>
<li><a href="about-us.html">about Us</a></li>
<li><a href="service.html">service</a></li>
<li><a href="news.html">latest news</a></li>
<li><a href="service-details.html">PAGES</a>
<ul>
<li><a href="service.html">service</a></li>
<li><a href="service-details.html">Service Details</a></li>
<li><a href="news.html">latest news</a></li>
<li><a href="news-details.html">News Details</a></li>
<li><a href="404.html">404 Error</a></li>
</ul>
</li>
<li><a href="contact-us.html">contact us</a></li>
</ul>
</nav>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- MOBILE-MENU-AREA END -->
</div>
</div>
<!-- Header Top Menu Area End -->
<!-- Slider Area Start -->
<div id="hero-area" class="hero-area hero-slider section">
<div class="hero-slider">
<!-- Slider Single -->
<div class="hero-item" style="background-image: url(img/hero/bg.jpg);">
<div class="container">
<div class="row">
<div class="content col-lg-6 col-md-7 col-xs-12">
<h1>Beautiful your car with <span>Car</span>Spa.</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit sed do Itd eiusmod tempor incididunt ut labore et dolore.</p>
<a href="#" class="read-more">LEARN MORE</a>
</div>
<div class="col-lg-6 col-md-5 d-none d-md-block">
<div class="images">
<img class="main" src="img/hero/sm-1.png" alt="">
</div>
</div>
</div>
</div>
</div>
<!-- Slider Single -->
<!-- Slider Single -->
<div class="hero-item" style="background-image: url(img/hero/bg-1.jpg);">
<div class="container">
<div class="row">
<div class="content col-lg-6 col-md-7 col-xs-12">
<h1>Beautiful your car with <span>Car</span>Spa.</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit sed do Itd eiusmod tempor incididunt ut labore et dolore.</p>
<a href="#" class="read-more">LEARN MORE</a>
</div>
<div class="col-lg-6 col-md-5 d-none d-md-block">
<div class="images">
<img class="main" src="img/hero/sm-2.png" alt="">
</div>
</div>
</div>
</div>
</div>
<!-- Slider Single -->
<!-- Slider Single -->
<div class="hero-item" style="background-image: url(img/hero/bg.jpg);">
<div class="container">
<div class="row">
<div class="content col-lg-6 col-md-7 col-xs-12">
<h1>Beautiful your car with <span>Car</span>Spa.</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit sed do Itd eiusmod tempor incididunt ut labore et dolore.</p>
<a href="#" class="read-more">LEARN MORE</a>
</div>
<div class="col-lg-6 col-md-5 d-none d-md-block">
<div class="images">
<img class="main" src="img/hero/sm-1.png" alt="">
</div>
</div>
</div>
</div>
</div>
<!-- Slider Single -->
</div>
</div>
<!-- Slider Area End -->
</header>
<!-- Header Area End -->
<!-- Page Content Wraper Area Start -->
<div class="page-content-wrapper">
<!-- Why Choose Us Area Start -->
<section class="chooseus-area ptb-105">
<div class="container">
<!-- Section Titel -->
<div class="row">
<div class="section-titel text-center mb-60">
<h2>WHY CHOOSE US</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit sed do Itd eiusmod tempor incididunt ut labore et dolore.</p>
</div>
</div>
<!-- Section Titel -->
<div class="row">
<div class="col-lg-4 col-md-12">
<div class="choose-img">
<img src="img/other/1.jpg" alt="" />
</div>
</div>
<div class="col-lg-8 col-md-12">
<div class="row">
<div class="col-md-6 col-sm-12">
<!-- Start choose box -->
<div class="choose-box mb-40">
<div class="choose-box-top">
<span><img src="img/icon/sitting-icon.png" alt="" /></span>
<h4 class="semi-title">BEST PRICE</h4>
</div>
<div class="choose-box-desc">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elitd sed do eiusmod tempor incidid</p>
</div>
</div>
<!-- End choose box -->
<!-- Start choose box -->
<div class="choose-box res-mb-sm-40">
<div class="choose-box-top">
<span><img src="img/icon/sitting-icon.png" alt="" /></span>
<h4 class="semi-title">GREAT VALUE</h4>
</div>
<div class="choose-box-desc">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elitd sed do eiusmod tempor incidid</p>
</div>
</div>
<!-- End choose box -->
</div>
<div class="col-md-6 col-sm-12">
<!-- Start choose box -->
<div class="choose-box mb-40">
<div class="choose-box-top">
<span><img src="img/icon/sitting-icon.png" alt="" /></span>
<h4 class="semi-title">EXPERIENCED TEAM</h4>
</div>
<div class="choose-box-desc">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elitd sed do eiusmod tempor incidid</p>
</div>
</div>
<!-- End choose box -->
<!-- Start choose box -->
<div class="choose-box">
<div class="choose-box-top">
<span><img src="img/icon/sitting-icon.png" alt="" /></span>
<h4 class="semi-title">QUICK SUPPORT</h4>
</div>
<div class="choose-box-desc">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elitd sed do eiusmod tempor incidid</p>
</div>
</div>
<!-- End choose box -->
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Why Choose Us Area End -->
<!-- Our Process Area Start -->
<section class="process-area ptb-105 gray-bg">
<div class="container">
<div class="row">
<div class="col-md-12">
<div class="procces-content">
<h2>OUR PROCESS</h2>
<ul class="service-tab-list text-center">
<li><span><img src="img/icon/book.png" alt="" /></span></li>
<li><span><img src="img/icon/home.png" alt="" /></span></li>
<li><span><img src="img/icon/car.png" alt="" /></span></li>
<li><span><img src="img/icon/complement.png" alt="" /></span></li>
</ul>
</div>
<div class="process-titel">
<ul>
<li>1. BOOKING</li>
<li>2. INSPECTION</li>
<li>3. VALUATION</li>
<li>4. COMPLETION</li>
</ul>
</div>
</div>
</div>
</div>
</section>
<!-- Our Process Area End -->
<!-- Our Service Area Start -->
<section class="ourservice-area ptb-105">
<div class="container">
<!-- Section Titel -->
<div class="row">
<div class="section-titel text-center mb-60">
<h2>OUR SERVICES</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit sed do Itd eiusmod tempor incididunt ut labore et dolore.</p>
</div>
</div>
<!-- Section Titel -->
<div class="row mb-n-30px">
<!-- Service Single -->
<div class="col-lg-3 col-md-6 mb-30px">
<div class="service-single">
<img src="img/service/1.png" alt="" />
<div class="service-titel text-center">
<h6>
<a href="#">WASH AND GLASSING</a>
<span><a href="#"><i class="zmdi zmdi-plus"></i></a></span>
</h6>
</div>
<div class="service-hover text-center">
<img src="img/icon/sitting-lrg.png" alt="" />
<h6>BREAK CHECKUP</h6>
<p>Lorem ipsum dolor sit amet con adipisicingelitd sed do</p>
<a href="service-details.html">DETAILS</a>
</div>
</div>
</div>
<!-- Service Single -->
<!-- Service Single -->
<div class="col-lg-3 col-md-6 mb-30px">
<div class="service-single">
<img src="img/service/2.png" alt="" />
<div class="service-titel text-center">
<h6>
<a href="#">WASH AND GLASSING</a>
<span><a href="#"><i class="zmdi zmdi-plus"></i></a></span>
</h6>
</div>
<div class="service-hover text-center">
<img src="img/icon/sitting-lrg.png" alt="" />
<h6>BREAK CHECKUP</h6>
<p>Lorem ipsum dolor sit amet con adipisicingelitd sed do</p>
<a href="service-details.html">DETAILS</a>
</div>
</div>
</div>
<!-- Service Single -->
<!-- Service Single -->
<div class="col-lg-3 col-md-6 mb-30px">
<div class="service-single">
<img src="img/service/3.png" alt="" />
<div class="service-titel text-center">
<h6>
<a href="#">WASH AND GLASSING</a>
<span><a href="#"><i class="zmdi zmdi-plus"></i></a></span>
</h6>
</div>
<div class="service-hover text-center">
<img src="img/icon/sitting-lrg.png" alt="" />
<h6>BREAK CHECKUP</h6>
<p>Lorem ipsum dolor sit amet con adipisicingelitd sed do</p>
<a href="service-details.html">DETAILS</a>
</div>
</div>
</div>
<!-- Service Single -->
<!-- Service Single -->
<div class="col-lg-3 col-md-6 mb-30px">
<div class="service-single">
<img src="img/service/4.png" alt="" />
<div class="service-titel text-center">
<h6>
<a href="#">WASH AND GLASSING</a>
<span><a href="#"><i class="zmdi zmdi-plus"></i></a></span>
</h6>
</div>
<div class="service-hover text-center">
<img src="img/icon/sitting-lrg.png" alt="" />
<h6>BREAK CHECKUP</h6>
<p>Lorem ipsum dolor sit amet con adipisicingelitd sed do</p>
<a href="service-details.html">DETAILS</a>
</div>
</div>
</div>
<!-- Service Single -->
</div>
</div>
</section>
<!-- Our Service Area Start -->
<!-- Funfact Area Start -->
<section class="funfact-area bg-2 ptb-105">
<div class="container">
<div class="row mb-n-30px">
<!-- Funfact Single -->
<div class="col-lg-3 col-md-6 col-xs-12 mb-30px">
<div class="funfact-single">
<div class="funfact-img">
<img src="img/funfact/1.png" alt="" />
</div>
<div class="funfact-count text-uppercase">
<h3><span class="counter">28</span>+</h3>
<h3>EXPERIENCE</h3>
</div>
</div>
</div>
<!-- Funfact Single -->
<!-- Funfact Single -->
<div class="col-lg-3 col-md-6 col-xs-12 mb-30px">
<div class="funfact-single">
<div class="funfact-img">
<img src="img/funfact/2.png" alt="" />
</div>
<div class="funfact-count text-uppercase">
<h3><span class="counter">790</span>+</h3>
<h3>HAPPY CLIENTS</h3>
</div>
</div>
</div>
<!-- Funfact Single -->
<!-- Funfact Single -->
<div class="col-lg-3 col-md-6 col-xs-12 mb-30px">
<div class="funfact-single hidden-sm">
<div class="funfact-img">
<img src="img/funfact/3.png" alt="" />
</div>
<div class="funfact-count text-uppercase">
<h3><span class="counter">1800</span>+</h3>
<h3>PEOPLE LIKES</h3>
</div>
</div>
</div>
<!-- Funfact Single -->
<!-- Funfact Single -->
<div class="col-lg-3 col-md-6 col-xs-12 mb-30px">
<div class="funfact-single">
<div class="funfact-img">
<img src="img/funfact/4.png" alt="" />
</div>
<div class="funfact-count text-uppercase">
<h3><span class="counter">50</span>+</h3>
<h3>AWARDS WON</h3>
</div>
</div>
</div>
<!-- Funfact Single -->
</div>
</div>
</section>
<!-- Funfact Area End -->
<!-- Pricing Plan Area Start -->
<section class="pricing-plan-area ptb-105">
<div class="container">
<!-- Section Titel -->
<div class="row">
<div class="section-titel text-center mb-60">
<h2>PRICING PLAN</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit sed do Itd eiusmod tempor incididunt ut labore et dolore.</p>
</div>
</div>
<!-- Section Titel -->
<div class="row mb-n-30px">
<!-- Pricing Plan Single -->
<div class="col-lg-4 col-md-6 mb-30px">
<div class="pricing-single text-center">
<div class="pricing-category">
<h2>BASIC WASH</h2>
<span>$90</span>
</div>
<div class="pricing-list">
<ul>
<li><a href="#">Exterior Hand Wash</a></li>
<li><a href="#">Towel Hand Dry</a></li>
<li><a href="#">Door Shuts & Plastics</a></li>
<li><a href="#">Triple Coat Hand Wax</a></li>
<li><a href="#">Air Freshener</a></li>
<li><a href="#">Interior Vacuum</a></li>
</ul>
</div>
<div class="order-button">
<a href="#">order now</a>
</div>
</div>
</div>
<!-- Pricing Plan Single -->
<!-- Pricing Plan Single -->
<div class="col-lg-4 col-md-6 mb-30px">
<div class="active pricing-single text-center">
<div class="pricing-category">
<h2>DELUXE WASH</h2>
<span>$100</span>
</div>
<div class="pricing-list">
<ul>
<li><a href="#">Exterior Hand Wash</a></li>
<li><a href="#">Towel Hand Dry</a></li>
<li><a href="#">Door Shuts & Plastics</a></li>
<li><a href="#">Triple Coat Hand Wax</a></li>
<li><a href="#">Air Freshener</a></li>
<li><a href="#">Interior Vacuum</a></li>
</ul>
</div>
<div class="order-button">
<a href="#">order now</a>
</div>
</div>
</div>
<!-- Pricing Plan Single -->
<!-- Pricing Plan Single -->
<div class="col-lg-4 col-md-6 mb-30px">
<div class="pricing-single text-center">
<div class="pricing-category">
<h2>PREMIUM WASH</h2>
<span>$110</span>
</div>
<div class="pricing-list">
<ul>
<li><a href="#">Exterior Hand Wash</a></li>
<li><a href="#">Towel Hand Dry</a></li>
<li><a href="#">Door Shuts & Plastics</a></li>
<li><a href="#">Triple Coat Hand Wax</a></li>
<li><a href="#">Air Freshener</a></li>
<li><a href="#">Interior Vacuum</a></li>
</ul>
</div>
<div class="order-button">
<a href="#">order now</a>
</div>
</div>
</div>
<!-- Pricing Plan Single -->
</div>
</div>
</section>
<!-- Pricing Plan Area End -->
<!-- Testimonial Area Start -->
<section class="testimonial-area ptb-105 bg-3 indicator-style">
<div class="container">
<div class="row">
<div class="testimonial-active owl-carousel owl-theme">
<!-- Testimonial Single -->
<div class="col-md-12">
<div class="testimonial-single">
<div class="tstimonial-img">
<img src="img/testimonial/1.png" alt="" />
</div>
<div class="testimonial-info">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit sed do Itd eiusmod tempor incididunt ut labore et dolore.</p>
<div class="testi-persn">
<h6>ROBIUL SIDDIKEE</h6>
<p>Graphic Designer</p>
</div>
</div>
</div>
</div>
<!-- Testimonial Single -->
<!-- Testimonial Single -->
<div class="col-md-12">
<div class="testimonial-single">
<div class="tstimonial-img">
<img src="img/testimonial/2.png" alt="" />
</div>
<div class="testimonial-info">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit sed do Itd eiusmod tempor incididunt ut labore et dolore.</p>
<div class="testi-persn">
<h6>Kausar Al Mamun</h6>
<p>Web Developer</p>
</div>
</div>
</div>
</div>
<!-- Testimonial Single -->
<!-- Testimonial Single -->
<div class="col-md-12">
<div class="testimonial-single">
<div class="tstimonial-img">
<img src="img/testimonial/3.png" alt="" />
</div>
<div class="testimonial-info">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit sed do Itd eiusmod tempor incididunt ut labore et dolore.</p>
<div class="testi-persn">
<h6>Nirob Khan</h6>
<p>Wordpress Developer</p>
</div>
</div>
</div>
</div>
<!-- Testimonial Single -->
</div>
</div>
</div>
</section>
<!-- Testimonial Area End -->
<!-- Team Member Area Start -->
<section class="team-member-area ptb-105">
<div class="container">
<!-- Section Titel -->
<div class="row">
<div class="section-titel text-center mb-60">
<h2>TEAM MEMBER</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit sed do Itd eiusmod tempor incididunt ut labore et dolore.</p>
</div>
</div>
<!-- Section Titel -->
<div class="row mb-n-30px">
<!-- Team Member Single -->
<div class="col-lg-3 col-md-6 mb-30px">
<div class="team-single">
<img src="img/team/1.png" alt="" />
<div class="team-deatils text-center">
<div class="team-info">
<h5>ROBIUL SIDDIKEE</h5>
<span>Engineer</span>
</div>
<ul class="team-social">
<li><a href="#"><i class="zmdi zmdi-facebook"></i></a></li>
<li><a href="#"><i class="zmdi zmdi-vimeo"></i></a></li>
<li><a href="#"><i class="zmdi zmdi-tumblr"></i></a></li>
<li><a href="#"><i class="zmdi zmdi-pinterest"></i></a></li>
</ul>
</div>
</div>
</div>
<!-- Team Member Single -->
<!-- Team Member Single -->
<div class="col-lg-3 col-md-6 mb-30px">
<div class="team-single">
<img src="img/team/2.png" alt="" />
<div class="team-deatils text-center">
<div class="team-info">
<h5>Kausar Al Mamun</h5>
<span>Designer</span>
</div>
<ul class="team-social">
<li><a href="#"><i class="zmdi zmdi-facebook"></i></a></li>
<li><a href="#"><i class="zmdi zmdi-vimeo"></i></a></li>
<li><a href="#"><i class="zmdi zmdi-tumblr"></i></a></li>
<li><a href="#"><i class="zmdi zmdi-pinterest"></i></a></li>
</ul>
</div>
</div>
</div>
<!-- Team Member Single -->
<!-- Team Member Single -->
<div class="col-lg-3 col-md-6 mb-30px">
<div class="team-single">
<img src="img/team/3.png" alt="" />
<div class="team-deatils text-center">
<div class="team-info">
<h5>Nirob Rana</h5>
<span>Designer</span>
</div>
<ul class="team-social">
<li><a href="#"><i class="zmdi zmdi-facebook"></i></a></li>
<li><a href="#"><i class="zmdi zmdi-vimeo"></i></a></li>
<li><a href="#"><i class="zmdi zmdi-tumblr"></i></a></li>
<li><a href="#"><i class="zmdi zmdi-pinterest"></i></a></li>
</ul>
</div>
</div>
</div>
<!-- Team Member Single -->
<!-- Team Member Single -->
<div class="col-lg-3 col-md-6 mb-30px">
<div class="team-single">
<img src="img/team/4.png" alt="" />
<div class="team-deatils text-center">
<div class="team-info">
<h5>Zenaul Khan</h5>
<span>Admin</span>
</div>
<ul class="team-social">
<li><a href="#"><i class="zmdi zmdi-facebook"></i></a></li>
<li><a href="#"><i class="zmdi zmdi-vimeo"></i></a></li>
<li><a href="#"><i class="zmdi zmdi-tumblr"></i></a></li>
<li><a href="#"><i class="zmdi zmdi-pinterest"></i></a></li>
</ul>
</div>
</div>
</div>
<!-- Team Member Single -->
</div>
</div>
</section>
<!-- Team Member Area End -->
<!-- Our Project Area Start -->
<section class="ourproject-area">
<!-- Section Titel -->
<div class="container">
<div class="row">
<div class="section-titel text-center mb-50">
<h2>OUR PROJECTS</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit sed do Itd eiusmod tempor incididunt ut labore et dolore.</p>
</div>
</div>
</div>
<!-- Section Titel -->
<div class="container-fluid">
<div class="row">
<div class="portfolio-content">
<!-- Latest Portfolio Tab Menu -->
<ul class="text-center portfolio-menu mb-45">
<li class="active" data-filter="*">ALL</li>
<li class="filter" data-filter=".c1">CLEAN</li>
<li class="filter" data-filter=".c2">REPAIR</li>
<li class="filter" data-filter=".c3">MUFFLERS</li>
<li class="filter" data-filter=".c4">OIL CHANGES</li>
</ul>
<!-- Latest Portfolio Tab Menu -->
<div class="grid img-full portfolio-box">
<!-- Portfolio Single -->
<div class="grid-item c1">
<div class="single-portfolio">
<div class="image-box">
<img src="img/project/1.png" alt="" />
<a class="venobox" href="img/project/1.png"><i class="zmdi zmdi-plus"></i></a>
</div>
</div>
</div>
<!-- Portfolio Single -->
<!-- Portfolio Single -->
<div class="grid-item c2 c4">
<div class="single-portfolio">
<div class="image-box">
<img src="img/project/3.png" alt="" />
<a class="venobox" href="img/project/2.png"><i class="zmdi zmdi-plus"></i></a>
</div>
</div>
</div>
<!-- Portfolio Single -->
<!-- Portfolio Single -->
<div class="grid-item c1 c3">
<div class="single-portfolio">
<div class="image-box">
<img src="img/project/4.png" alt="" />
<a class="venobox" href="img/project/3.png"><i class="zmdi zmdi-plus"></i></a>
</div>
</div>
</div>
<!-- Portfolio Single -->
<!-- Portfolio Single -->
<div class="grid-item c3 c1">
<div class="single-portfolio">
<div class="image-box">
<img src="img/project/6.png" alt="" />
<a class="venobox" href="img/project/4.png"><i class="zmdi zmdi-plus"></i></a>
</div>
</div>
</div>
<!-- Portfolio Single -->
<!-- Portfolio Single -->
<div class="grid-item c4 c3 c1">
<div class="single-portfolio">
<div class="image-box">
<img src="img/project/5.png" alt="" />
<a class="venobox" href="img/project/5.png"><i class="zmdi zmdi-plus"></i></a>
</div>
</div>
</div>
<!-- Portfolio Single -->
<!-- Portfolio Single -->
<div class="grid-item c4 c3 c1">
<div class="single-portfolio">
<div class="image-box">
<img src="img/project/2.png" alt="" />
<a class="venobox" href="img/project/5.png"><i class="zmdi zmdi-plus"></i></a>
</div>
</div>
</div>
<!-- Portfolio Single -->
</div>
</div>
</div>
</div>
</section>
<!-- Our Project Area End -->
<!-- Latest News Start -->
<section class="latest-news-area pt-80 pb-105">
<div class="container">
<!-- Section Titel -->
<div class="row">
<div class="section-titel text-center mb-60">
<h2>LATEST NEWS</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit sed do Itd eiusmod tempor incididunt ut labore et dolore.</p>
</div>
</div>
<!-- Section Titel -->
<div class="row mb-n-30px">
<!-- Latest News Single -->
<div class="col-lg-4 col-md-6 mb-30px">
<div class="latest-single">
<div class="ltst-img">
<img src="img/news/1.png" alt="" />
</div>
<div class="latest-content text-center">
<div class="ltst-single">
<h6><a href="#">WASH AND GLASSING</a></h6>
<div class="ltst-post">
<span>January 18, 2022</span>
<span><a href="#">5 Comments</a></span>
</div>
<p>Lorem ipsum dolor sit awmet, consecte ytur adip elit, sed do eiusmod tempor incididunt ut labore et dolore magna.</p>
<div class="lastest-btn">
<a href="news-details.html">READ MORE</a>
</div>
</div>
</div>
</div>
</div>
<!-- Latest News Single -->
<!-- Latest News Single -->
<div class="col-lg-4 col-md-6 mb-30px">
<div class="latest-single">
<div class="ltst-img">
<img src="img/news/2.png" alt="" />
</div>
<div class="latest-content text-center">
<div class="ltst-single">
<h6><a href="#">WASH AND GLASSING</a></h6>
<div class="ltst-post">
<span>January 18, 2022</span>
<span><a href="#">5 Comments</a></span>
</div>
<p>Lorem ipsum dolor sit awmet, consecte ytur adip elit, sed do eiusmod tempor incididunt ut labore et dolore magna.</p>
<div class="lastest-btn">
<a href="news-details.html">READ MORE</a>
</div>
</div>
</div>
</div>
</div>
<!-- Latest News Single -->
<!-- Latest News Single -->
<div class="col-lg-4 col-md-6 mb-30px">
<div class="latest-single">
<div class="ltst-img">
<img src="img/news/3.png" alt="" />
</div>
<div class="latest-content text-center">
<div class="ltst-single">
<h6><a href="#">WASH AND GLASSING</a></h6>
<div class="ltst-post">
<span>January 18, 2022</span>
<span><a href="#">5 Comments</a></span>
</div>
<p>Lorem ipsum dolor sit awmet, consecte ytur adip elit, sed do eiusmod tempor incididunt ut labore et dolore magna.</p>
<div class="lastest-btn">
<a href="news-details.html">READ MORE</a>
</div>
</div>
</div>
</div>
</div>
<!-- Latest News Single -->
</div>
</div>
</section>
<!-- Latest News End -->
</div>
<!-- Page Content Wraper Area End -->
<!-- Fotter Area Start -->
<footer class="bg-4">
<!-- Footer Top Arae Start -->
<div class="footer-top pt-105 pb-100">
<div class="container">
<div class="row mb-n-30px">
<!-- Footer Top Single -->
<div class="col-lg-3 col-md-6 mb-30px">
<div class="address-area">
<h4>COMPANY</h4>
<a href="index.html"><img src="img/icon/footer-logo.png" alt=""></a>
<p>Lorem ipsum dolor sit amet, consecteturadipisicing elit sed do Itd eiusmod tempor incididunt ut labore et dolore.</p>
<div class="contact-social">
<ul>
<li><a href="#"><i class="zmdi zmdi-facebook"></i></a></li>
<li><a href="#"><i class="zmdi zmdi-vimeo"></i></a></li>
<li><a href="#"><i class="zmdi zmdi-tumblr"></i></a></li>
<li><a href="#"><i class="zmdi zmdi-pinterest"></i></a></li>
</ul>
</div>
</div>
</div>
<!-- Footer Top Single -->
<!-- Footer Top Single -->
<div class="col-lg-2 col-md-6 mb-30px">
<div class="address-area">
<h4>QUICK LINK</h4>
<div class="footer-menu">
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">Choose Us</a></li>
<li><a href="#">About us</a></li>
<li><a href="#">Process</a></li>
<li><a href="#">Our Services</a></li>
<li><a href="#">Pricing Plan</a></li>
<li><a href="#">Team Member</a></li>
<li><a href="#">Our Projects</a></li>
<li><a href="#">Contact</a></li>
</ul>
</div>
</div>
</div>
<!-- Footer Top Single -->
<!-- Footer Top Single -->
<div class="col-lg-4 col-md-6 mb-30px">
<div class="address-area">
<h4>LATEST NEWS</h4>
<div class="footer-news">
<ul>
<li>
<div class="news-img">
<img src="img/news/s-1.png" alt="" />
</div>
<div class="news-cntnt">
<h6><a href="news-details.html">WASH AND GLASSING</a></h6>
<p>Lorem ipsum dolor sit amet, consectetu robi adipis adipisicing elit sed d o eius .</p>
</div>
</li>
<li>
<div class="news-img">
<img src="img/news/s-2.png" alt="" />
</div>
<div class="news-cntnt">
<h6><a href="news-details.html">WASH AND GLASSING</a></h6>
<p>Lorem ipsum dolor sit amet, consectetu robi adipis adipisicing elit sed d o eius .</p>
</div>
</li>
<li>
<div class="news-img">
<img src="img/news/s-3.png" alt="" />
</div>
<div class="news-cntnt">
<h6><a href="news-details.html">WASH AND GLASSING</a></h6>
<p>Lorem ipsum dolor sit amet, consectetu robi adipis adipisicing elit sed d o eius .</p>
</div>
</li>
</ul>
</div>
</div>
</div>
<!-- Footer Top Single -->
<!-- Footer Top Single -->
<div class="col-lg-3 col-md-6 mb-30px">
<div class="address-area">
<h4>CONTACT US</h4>
<div class="contact-details">
<ul>
<li>
<i class="zmdi zmdi-email"></i>
<p>Mail: example@examplel.com info@example.com</p>
</li>
<li>
<i class="zmdi zmdi-phone"></i>
<p>Telephone : (801) 4256456 985634 Telephone : (801) 4256456 985634</p>
</li>
<li>
<i class="zmdi zmdi-pin"></i>
<p>Alcatraz Island Photo Album Dhaka . Bangladesh</p>
</li>
</ul>
</div>
<div class="search-input">
<form id="mc-form">
<input autocomplete="off" placeholder="Subcribe" type="text">
<button value="Submit" type="submit" class="search-button"><i class="zmdi zmdi-mail-send"></i></button>
<!-- mailchimp-alerts Start -->
<div class="mailchimp-alerts text-centre">
<div class="mailchimp-submitting"></div><!-- mailchimp-submitting end -->
<div class="mailchimp-success"></div><!-- mailchimp-success end -->
<div class="mailchimp-error"></div><!-- mailchimp-error end -->
</div>
<!-- mailchimp-alerts end -->
</form>
</div>
</div>
</div>
<!-- Footer Top Single -->
</div>
</div>
</div>
<!-- Footer Top Arae End -->
<!-- Footer Bottom Area Start -->
<!-- Footer Bottom Area End -->
</footer>
<!-- Fotter Area End -->
<!-- all js here -->
<script src="js/vendor/jquery-1.12.4.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/jquery.meanmenu.js"></script>
<script src="js/jquery.ajaxchimp.min.js"></script>
<script src="js/plugins.js"></script>
<script src="js/main.js"></script>
</body>
</html>
一站式 AI 云服务平台
更多推荐
4
0- 0
已为社区贡献3条内容
所有评论(0)