OLÁ PESSOAL,
SEGUE ABAIXO O LINK PARA FAZER O DOWNLOAD DOS ARQUIVOS CSS DO BOOTSTRAP - DOWNLOAD AQUI
SEGUE TAMBÉM AS IMAGENS QUE SERÁ UTILIZADAS - DOWNLOAD AQUI
SEGUE O LINK DO JAVASCRITPS - DOWNLOAD AQUI
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>Site exemplo</title>
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="css/estilo.css">
<!-- fontes para icones -->
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.10/css/all.css" integrity="sha384-+d0P83n9kaQMCwj8F4RJB66tzIwOKmrdb46+porD/OvrJ+37WqIM7UoBtwHO6Nlg" crossorigin="anonymous">
</head>
<body>
<div class="container-fluid bg-topo">
<header class="container">
<nav class="navbar navbar-expand-lg navbar-dark">
<a href="#" class="navbar-brand">
<img src="img/Infinity-Dev.png" height="60" class="d-inline-block align-top">
</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#menu"
aria-controls="menu" aria-expanded="false" aria-label="Menu Colapso">
<span class="navbar-toggler-icon text-light"></span>
</button>
<div id="menu" class="collapse navbar-collapse">
<ul class="navbar-nav mr-auto text-light">
<li class="nav-item">
<a href="#servicos" class="nav-link text-light font-weight-bold scroll-page">Serviços</a>
</li>
<li class="nav-item">
<a href="#parceiros" class="nav-link text-light font-weight-bold scroll-page">Parceiros</a>
</li>
<li class="nav-item">
<a href="#cursos" class="nav-link text-light font-weight-bold scroll-page">Cursos</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link text-light font-weight-bold scroll-page">Contato</a>
</li>
</ul>
<a href="#" class="btn col-md-3 btn-orcamento">Pedir um orçamento</a>
</div>
</nav>
</header>
</div>
<!-- Slide show-->
<div class="container-fluid my-2">
<div id="slideshow" class="carousel Slide" data-ride="carousel">
<ol class="carousel-indicators">
<li data-target="#slideshow" data-slide-to="0" class="active"></li>
<li data-target="#slideshow" data-slide-to="1" ></li>
</ol>
<div class="carousel-inner">
<div class="carousel-item active">
<a href="#">
<img src="img/banner1.png" class="d-block w-100" alt="Primeiro Slide">
</a>
</div>
<div class="carousel-item ">
<a href="#">
<img src="img/banner2.png" class="d-block w-100" alt="Segundo Slide">
</a>
</div>
</div>
<a href="#slideshow" class="carousel-control-prev" role="button"data-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="sr-only">Anterior</span>
</a>
<a href="#slideshow" class="carousel-control-next" role="button"data-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="sr-only">Proximo</span>
</a>
<a href="#slideshow" class="carousel-control-next" role="button"data-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="sr-only">Proximo</span>
</a>
<a href="#slideshow" class="carousel-control-next" role="button"data-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="sr-only">Proximo</span>
</a>
</div>
</div>
<!--seção de serviços-->
<div id="servicos"class="container-fluid bg-servicos">
<div class="mt-2 py-4">
<section class="container">
<header class="col-md-12">
<h2 class="text-center text-light ">O que Fazemos?
<span class="underline"></span>
</h2>
</header>
<div class="row py-4">
<div class="col-md-4">
<img src="img/img1.png" class="img-fluid">
<p class="text-center text-light mt-2">Criação de Web sites Responsiveis</p>
</div>
<div class="col-md-4">
<img src="img/manutencao.png" class="img-fluid">
<p class="text-center text-light mt-2">Manutenção e suporte a Hardware e Software</p>
</div>
<div class="col-md-4">
<img src="img/img3.png" class="img-fluid">
<p class="text-center text-light mt-2">Otimizações de sites na web</p>
</div>
</div>
</section>
</div>
</div>
<!-- seçao de parceiros -->
<div id="parceiros" class="container-fluid py-4 bg-parceiros">
<div class="py-2">
<div class="container">
<header class="col-md-12">
<h2 class="text-center ">Conheça nossos parceiros
<span class="underline"></span>
</h2>
</header>
<div class="row py-4">
<div class="col-md-2 padding-parceiros">
<div class="card sombra">
<div class="card-body">
<a href="#">
<img src="img/parceiro1.png" class="img-fluid mx-auto d-block">
</a>
</div>
</div>
</div>
<div class="col-md-2 padding-parceiros">
<div class="card sombra">
<div class="card-body">
<a href="#">
<img src="img/parceiro2.png" class="img-fluid mx-auto d-block">
</a>
</div>
</div>
</div>
<div class="col-md-2 padding-parceiros">
<div class="card sombra">
<div class="card-body">
<a href="#">
<img src="img/parceiro1.png" class="img-fluid mx-auto d-block">
</a>
</div>
</div>
</div>
<div class="col-md-2 padding-parceiros">
<div class="card sombra">
<div class="card-body">
<a href="#">
<img src="img/parceiro2.png" class="img-fluid mx-auto d-block">
</a>
</div>
</div>
</div>
<div class="col-md-2 padding-parceiros">
<div class="card sombra">
<div class="card-body">
<a href="#">
<img src="img/parceiro1.png" class="img-fluid mx-auto d-block">
</a>
</div>
</div>
</div>
<div class="col-md-2 padding-parceiros">
<div class="card sombra">
<div class="card-body">
<a href="#">
<img src="img/parceiro2.png" class="img-fluid mx-auto d-block">
</a>
</div>
</div>
</div>
<div class="col-md-2 padding-parceiros">
<div class="card sombra">
<div class="card-body">
<a href="#">
<img src="img/parceiro1.png" class="img-fluid mx-auto d-block">
</a>
</div>
</div>
</div>
<div class="col-md-2 padding-parceiros">
<div class="card sombra">
<div class="card-body">
<a href="#">
<img src="img/parceiro2.png" class="img-fluid mx-auto d-block">
</a>
</div>
</div>
</div>
<div class="col-md-2 padding-parceiros">
<div class="card sombra">
<div class="card-body">
<a href="#">
<img src="img/parceiro1.png" class="img-fluid mx-auto d-block">
</a>
</div>
</div>
</div>
<div class="col-md-2 padding-parceiros">
<div class="card sombra">
<div class="card-body">
<a href="#">
<img src="img/parceiro2.png" class="img-fluid mx-auto d-block">
</a>
</div>
</div>
</div>
<div class="col-md-2 padding-parceiros">
<div class="card sombra">
<div class="card-body">
<a href="#">
<img src="img/parceiro1.png" class="img-fluid mx-auto d-block">
</a>
</div>
</div>
</div>
<div class="col-md-2 padding-parceiros">
<div class="card sombra">
<div class="card-body">
<a href="#">
<img src="img/parceiro2.png" class="img-fluid mx-auto d-block">
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- seção paralax -->
<div id="cursos" class="container-fluid bg-parallax">
<div class="py-4">
<section class="container">
<header class="col-md-12">
<h2 class="text-center text-light">PontoCursos
<span class="underline"></span>
</h2>
<p class="text-center text-light"> Cursos de programação e Design - feito por especialistas da InfinityDev com o objetivo de levar conhecimento de forma acessível a todos</p>
</header>
<div class="row py-2">
<div class="col-sm-6 col-md-3 col-lg-3">
<div class="fatos">
<div class="icon">
<i class="fa fa-clock"> </i>
</div>
<div class="fatos-contador">
<h3>+ <span class="contar">43678</span></h3>
<h4>Minutos de conteúdo</h4>
</div>
</div>
</div>
<div class="col-sm-6 col-md-3 col-lg-3">
<div class="fatos">
<div class="icon">
<i class="fa fa-book"> </i>
</div>
<div class="fatos-contador">
<h3><span class="contar">16</span></h3>
<h4>Cursos Completos</h4>
</div>
</div>
</div>
<div class="col-sm-6 col-md-3 col-lg-3">
<div class="fatos">
<div class="icon">
<i class="fa fa-users"> </i>
</div>
<div class="fatos-contador">
<h3>+ <span class="contar">28970</span></h3>
<h4>Usuários</h4>
</div>
</div>
</div>
<div class="col-sm-6 col-md-3 col-lg-3">
<div class="fatos">
<div class="icon">
<i class="fa fa-star"> </i>
</div>
<div class="fatos-contador">
<h3>+ <span class="contar">4.8</span></h3>
<h4>Média de Avaliação</h4>
</div>
</div>
</div>
</div>
</section>
</div>
</div>
<!-- seção de cursos !-->
<div class="container-fluid">
<div class="my-2 py-4">
<section class="container">
<header class="col-md-12">
<h2 class="text-center">Cursos com 97% OFF
<span class="underline"></span>
</h2>
</header>
<div class="row py-4">
<div class="col-sm-6 col-md-3 col-xs-12">
<div class="tabela-preco sombra">
<div class="preco-detalhe">
<h2>Framework PHP Laravel 5.6</h2>
<strike>R$ 429,99 </strike>
<span>R$ 19,99</span>
<ul>
<li>Vídeo sob demanda de 5h</li>
<li>+ de 40 vídeos aulas</li>
<li>Acesso total e vitalício</li>
<li>Certificado de conclusão</li>
</ul>
</div>
<div class="preco-botao">
<a href="#" class="btn btn-preco">Comprar Agora</a>
</div>
<small>Garantia de satisfação de 30 dias</small>
</div>
</div>
<div class="col-sm-6 col-md-3 col-xs-12">
<div class="tabela-preco sombra">
<div class="preco-detalhe">
<h2>Framework PHP Laravel 5.6</h2>
<strike>R$ 429,99 </strike>
<span>R$ 19,99</span>
<ul>
<li>Vídeo sob demanda de 5h</li>
<li>+ de 40 vídeos aulas</li>
<li>Acesso total e vitalício</li>
<li>Certificado de conclusão</li>
</ul>
</div>
<div class="preco-botao">
<a href="#" class="btn btn-preco">Comprar Agora</a>
</div>
<small>Garantia de satisfação de 30 dias</small>
</div>
</div>
<div class="col-sm-6 col-md-3 col-xs-12">
<div class="tabela-preco sombra">
<div class="preco-detalhe">
<h2>Framework PHP Laravel 5.6</h2>
<strike>R$ 429,99 </strike>
<span>R$ 19,99</span>
<ul>
<li>Vídeo sob demanda de 5h</li>
<li>+ de 40 vídeos aulas</li>
<li>Acesso total e vitalício</li>
<li>Certificado de conclusão</li>
</ul>
</div>
<div class="preco-botao">
<a href="#" class="btn btn-preco">Comprar Agora</a>
</div>
<small>Garantia de satisfação de 30 dias</small>
</div>
</div>
<div class="col-sm-6 col-md-3 col-xs-12">
<div class="tabela-preco sombra">
<div class="preco-detalhe">
<h2>Framework PHP Laravel 5.6</h2>
<strike>R$ 429,99 </strike>
<span>R$ 19,99</span>
<ul>
<li>Vídeo sob demanda de 5h</li>
<li>+ de 40 vídeos aulas</li>
<li>Acesso total e vitalício</li>
<li>Certificado de conclusão</li>
</ul>
</div>
<div class="preco-botao">
<a href="#" class="btn btn-preco">Comprar Agora</a>
</div>
<small>Garantia de satisfação de 30 dias</small>
</div>
</div>
</div>
</div>
</section>
</div>
</div>
<!-- links js -->
<script type="text/javascript" src="js/jquery-min.js">
</script><script type="text/javascript" src="js/bootstrap.min.js"></script>
</script><script type="text/javascript" src="js/jquery.counterup.min.js"></script>
</script><script type="text/javascript" src="js/waypoints.min.js"></script>
<script type="text/javascript" src="js/main.js"></script>
terça-feira, 20 de novembro de 2018
terça-feira, 14 de agosto de 2018
quinta-feira, 14 de junho de 2018
quarta-feira, 6 de junho de 2018
quarta-feira, 18 de abril de 2018
Assinar:
Comentários (Atom)