"Blog - Página 01"
Bootstrap 4.1.1 Snippet by Andreza12

<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <!DOCTYPE html> <html lang="pt-br"><!--Lang define a Linguagem do código fonte.--> <head><!--Define a cabeça do meu código fonte.--> <title>Ah Bordo</title><!--Title define o título.--> <meta charset="utf-8"><!--O atributo charset especifica a codificação de caracteres para o documento HTML.--> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"><!--O atributo name especifica o nome dos metadados.A contentpropriedade é usada com os pseudo-elementos :: before e :: after , para inserir o conteúdo gerado.--> <link href="https://fonts.googleapis.com/css?family=Poppins:200,300,400,500,600,700" rel="stylesheet"><!--O atributo href especifica a localização (URL) do recurso externo (geralmente um arquivo de folha de estilo).--> <link href="https://fonts.googleapis.com/css?family=Playfair+Display:400,400i,700,700i" rel="stylesheet"><!--O atributo href especifica a localização (URL) do recurso externo (geralmente um arquivo de folha de estilo).--> <link rel="stylesheet" href="css/open-iconic-bootstrap.min.css"><!--O atributo href especifica a localização (URL) do recurso externo (geralmente um arquivo de folha de estilo).--> <link rel="stylesheet" href="css/animate.css"><!--O atributo href especifica a localização (URL) do recurso externo (geralmente um arquivo de folha de estilo).--> <link rel="stylesheet" href="css/owl.carousel.min.css"><!--O atributo href especifica a localização (URL) do recurso externo (geralmente um arquivo de folha de estilo).--> <link rel="stylesheet" href="css/owl.theme.default.min.css"><!--O atributo href especifica a localização (URL) do recurso externo (geralmente um arquivo de folha de estilo).--> <link rel="stylesheet" href="css/magnific-popup.css"><!--O atributo href especifica a localização (URL) do recurso externo (geralmente um arquivo de folha de estilo).--> <link rel="stylesheet" href="css/aos.css"><!--O atributo href especifica a localização (URL) do recurso externo (geralmente um arquivo de folha de estilo).--> <link rel="stylesheet" href="css/ionicons.min.css"><!--O atributo href especifica a localização (URL) do recurso externo (geralmente um arquivo de folha de estilo).--> <link rel="stylesheet" href="css/bootstrap-datepicker.css"><!--O atributo href especifica a localização (URL) do recurso externo (geralmente um arquivo de folha de estilo).--> <link rel="stylesheet" href="css/jquery.timepicker.css"><!--O atributo href especifica a localização (URL) do recurso externo (geralmente um arquivo de folha de estilo).--> <link rel="stylesheet" href="css/flaticon.css"><!--O atributo href especifica a localização (URL) do recurso externo (geralmente um arquivo de folha de estilo).--> <link rel="stylesheet" href="css/icomoon.css"><!--O atributo href especifica a localização (URL) do recurso externo (geralmente um arquivo de folha de estilo).--> <link rel="stylesheet" href="css/style.css"><!--O atributo href especifica a localização (URL) do recurso externo (geralmente um arquivo de folha de estilo).--> <link rel="icon" href="images/logo.jpg"> </head> <body> <!-- Começo Navbar--> <nav class="navbar navbar-expand-lg navbar-dark ftco_navbar bg-dark ftco-navbar-light" id="ftco-navbar"><!--A <nav> tag define um conjunto de links de navegação.--> <div class="container"><!--A <nav> tag define um conjunto de links de navegação.--> <a class="navbar-brand" href="index.html">Ah Bordo</a><!--A <a>tag define um hiperlink, que é usado para vincular de uma página a outra.O class atributo HTML é usado para especificar uma classe para um elemento HTML.--> <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#ftco-nav" aria-controls="ftco-nav" aria-expanded="false" aria-label="Toggle navigation"><!--A <button> tag define um botão clicável. Type - define o tipo.--> <span class="oi oi-menu"></span> Menu<!--A <span>tag é um contêiner embutido usado para marcar uma parte de um texto ou uma parte de um documento.--> </button> <div class="collapse navbar-collapse" id="ftco-nav"><!--A <nav> tag define um conjunto de links de navegação.O id atributo especifica um id único para um elemento HTML.--> <ul class="navbar-nav ml-auto"><!--A <ul> tag define uma lista não ordenada (com marcadores).--> <li class="nav-item"><a href="index.html" class="nav-link">Início </a></li> <!--A <li> tag define um item da lista--> <li class="nav-item"><a href="placotes.html" class="nav-link">Pacotes</a></li> <!--A <li> tag define um item da lista--> <li class="nav-item"><a href="login.html" class="nav-link">Login</a></li> <!--A <li> tag define um item da lista--> <li class="nav-item"><a href="blog.html" class="nav-link">Blog</a></li> <!--A <li> tag define um item da lista--> <li class="nav-item active"><a href="contato.html" class="nav-link">Contato</a></li> <li class="nav-item"><a href="fidelidade.html" class="nav-link">Descontos</a></li> <!--A <li> tag define um item da lista--> <li class="nav-item"><a href="sobrenos.html" class="nav-link">Sobre nós</a></li> <!--A <li> tag define um item da lista--> </ul> </div> </div> </nav> <!-- Fim da NAVBAR --> <div class="hero-wrap" style="background-image: url('images/cabofrio1.jpg');"><!--A <nav> tag define um conjunto de links de navegação, O class atributo HTML é usado para especificar uma classe para um elemento HTML..--> <div class="overlay"></div><!--A <nav> tag define um conjunto de links de navegação, O class atributo HTML é usado para especificar uma classe para um elemento HTML..--> <div class="container"><!--A <nav> tag define um conjunto de links de navegação, O class atributo HTML é usado para especificar uma classe para um elemento HTML..--> <div class="row no-gutters slider-text d-flex align-itemd-end justify-content-center"><!--A <nav> tag define um conjunto de links de navegação, O class atributo HTML é usado para especificar uma classe para um elemento HTML..--> <div class="col-md-9 ftco-animate text-center d-flex align-items-end justify-content-center"><!--A <nav> tag define um conjunto de links de navegação, O class atributo HTML é usado para especificar uma classe para um elemento HTML..--> <div class="text"><!--A <nav> tag define um conjunto de links de navegação, O class atributo HTML é usado para especificar uma classe para um elemento HTML..--> <p class="breadcrumbs mb-2" data-scrollax="properties: { translateY: '30%', opacity: 1.6 }"><span class="mr-2"><a href="index.html">Início</a></span> <span class="mr-2"><a href="blog.html">Blog</a></span> <span>Cabo Frio</span></p> <h1 class="mb-4 bread">Cabo Frio</h1> <!--h1 define o Título--> </div> </div> </div> </div> </div> <section class="ftco-section ftco-degree-bg"> <!--A <section> tag define uma seção em um documento.--> <div class="container"> <!--A <nav> tag define um conjunto de links de navegação, O class atributo HTML é usado para especificar uma classe para um elemento HTML..--> <div class="row"><!--A <nav> tag define um conjunto de links de navegação, O class atributo HTML é usado para especificar uma classe para um elemento HTML..--> <div class="col-lg-8 ftco-animate order-md-last"><!--A <nav> tag define um conjunto de links de navegação, O class atributo HTML é usado para especificar uma classe para um elemento HTML..--> <h2 class="mb-3">Pontos Turísticos de Cabo Frio</h2> <!--h2 define subtítulo.--> <p>As águas transparentes e as areais clarinhas são as marcas registradas das praias de Cabo Frio. Cartão-postal, a do Forte é a mais movimentada, tomada por turistas e jovens. Já as praias das Dunas, do Foguete e do Peró têm boas ondas e surfistas.</p> <!--<p> define um parágrafo.--> <p> <img src="images/cabofrio2.png" alt="" class="img-fluid"> <!--img define uma imagem.--> </p> <p>A principal praia de Cabo Frio é bastante extensa - tem 7,5 quilômetros de extensão e, mesmos assim, fica lotada na alta temporada. Cartão-postal da cidade em função das águas transparentes (e geladas), da areia clarinha e do forte São Mateus no canto esquerdo. A praia foi considerada por velejadores internacionais a maior raia do mundo para a prática do esporte.</p> <!--<p> define um parágrafo.--> <h2 class="mb-3 mt-5">Arraial do cabo</h2> <!--h2 define um subtitulo.--> <p>Arraial não é uma cidade que oferece grandes atrações, museus, feiras e monumentos. Porém um pouquinho da história da conquista da cidade pelos europeus (antes a região era ocupada principalmente por índios tamoios), no início do século XVI, pode ser visitada no Centro Histórico. Um pequeno obelisco marca o ponto da chegada dos conquistadores. </p> <p> <img src="images/cabofrio3.jpg" alt="" class="img-fluid"> </p> <p>Entre as praias da cidade, a que atraia mais atenção é a belíssima Praia do Farol. Para visitá-la será necessário fazer um passeio de barco. São permitidos apenas 250 visitantes na praia a cada 45 minutos. É um lugar raro, por isso mesmo ainda mais especial. No mesmo passeio você também conhecerá a Gruta Azul, onde a luz do sol oferece um dos mais belos espetáculos do mar de Arraial. Paradas obrigatórias, a Praia do Forno e as Prainhas do Pontal do Atalaia atraem pela paisagem digna de cartões postais. São cenários paradisíacos e hipnotizantes, especialmente para quem chega a pé pelo alto das duas praias. Os dois mirantes são imperdíveis, assim como o mirante do Pontal do Atalaia, de onde se vê o mais belo pôr do sol da cidade. </p> <p>De pôr do sol a Praia Grande também está bem servida. O mar por lá é bem agitado, mas a praia é predileta para quem deseja curtir o entardecer à beira-mar. Agitadas também são as ondas da Praia Brava. O local tem acesso difícil, mas recompensa os turistas com uma faixa de areia quase exclusiva. Com características opostas, a Prainha encanta com o mar calmo, mas areia muito agitada! É uma das mais populares entre os moradores e nos finais de semana tem quiosques lotados. Meio termo entre as duas, a Praia do Pontal tem pouca gente e oferece um mar com ondas comportadas. Ótima para quem deseja exclusividade, mas sem isolamento. Para fechar o roteiro, visite o lindo cenário da Praia dos Anjos, onde os barcos oferecem a silhueta para um maravilhoso nascer do sol, onde chegam os pescadores repletos de peixes e frutos do mar fresquinhos. </p> <div class="tag-widget post-tag-container mb-5 mt-5"> <div class="tagcloud"> <a href="#" class="tag-cloud-link">Vida</a> <a href="#" class="tag-cloud-link">Esporte</a> <a href="#" class="tag-cloud-link">Tecnologia</a> <a href="#" class="tag-cloud-link">Viagem</a> </div> </div> <!--Começo comentários--> <div class="pt-5 mt-5"> <h3 class="mb-5">05 Comentários</h3> <ul class="comment-list"> <li class="comment"> <div class="vcard bio"> <img src="images/pessoa1.jpg" alt="Image placeholder"> </div> <div class="comment-body"> <h3>Fernando Morais</h3> <div class="meta"> 12 Julho de 2020 as 21:30 </div> <p>A primeira vez que estive nesta praia, tive a certeza que Deus existe!! É um lugar tão perfeito... Incrível poder caminhar nesta areia tão branca, e tomar um banho de mar em uma água tão cristalina... A melhor época é sem dúvida a baixa temporada.. Praia vazia, calma, tudo ao seu dispor!!! Tem a Feira de Artesanato, rua dos biquínis, os quiosques lindos de frente para o mar... Além de tudo isso, de Cabo Frio tem fácil acesso as cidades vizinhas, Búzios e Arraial do Cabo!!! O melhor lugar pra se hospedar com certeza é Cabo Frio, que fica no meio entre as outras, facilitando a locomoção!!! Cabo Frio, é um lugar para lavar a alma!!!!! Vá com boas energias, e tenha certeza que este é o lugar para esquecer dos problemas!!! ;)</p> <p><a href="#" class="reply">Resposta</a></p> </div> </li> <li class="comment"> <div class="vcard bio"> <img src="images/pessoa2.jpg" alt="Image placeholder"> </div> <div class="comment-body"> <h3>Juliana Alves</h3> <div class="meta">15 de Julho de 2020 as 15:00</div> <p>Cabo Frio é uma cidade lindíssima, e um dos melhores pontos para se hospedar certamente é onde se localiza a Praia do Forte. A orla é repleta de barzinhos, pizzarias, sorveterias, restaurantes, etc. Para quem está acostumado com o nordeste, pode estranhar a água gelada desta região, mas no verão quem se preocupa com isso, né? rs Bom passeio!</p> <p><a href="#" class="reply">Resposta</a></p> </div> <ul class="children"> <li class="comment"> <div class="vcard bio"> <img src="images/pessoa3.jpg" alt="Image placeholder"> </div> <div class="comment-body"> <h3>Fabiana Santos</h3> <div class="meta">16 de Julho de 2020 as 17:45</div> <p>Adorei ter conhecido Cabo Frio! A cidade é desenvolvida e tem tudo que você precisa, principalmente agências bancárias, pois tudo é caro lá. Minha dica é ficar mais próximo ao centro. Não deixe de comer o peixe da barraca Costa do Sol. Faça os passeios de barco, vale a pena. Paguei R$ 30 para ir a Arraial do Cabo e conhecer duas praias lindas e sem contar a paissagem. O serviço é disponível nos hoteis e pousadas e tem até carro para te buscar. Outra delícia é a pizza quadrada, recomendo a D'Itália. Não vejo a hora de voltar lá!</p> <p><a href="#" class="reply">Resposta</a></p> </div> <ul class="children"> <li class="comment"> <div class="vcard bio"> <img src="images/pessoa4.jpg" alt="Image placeholder"> </div> <div class="comment-body"> <h3>Matheus Henrrique</h3> <div class="meta">20 de Julho de 2020 as 21:40</div> <p>É a praia mais linda, areia branquinha e se ficar próximo ao Forte à 2 km poderá mergulhar, boiar e se quiser até cochilar boiando, de tão brandas as ondas. É uma delícia e recomendo a todos. Existem vários restaurante em frente a praia.</p> <p><a href="#" class="reply">Resposta</a></p> </div> <ul class="children"> <li class="comment"> <div class="vcard bio"> <img src="images/pessoa5.jpg" alt="Image placeholder"> </div> <div class="comment-body"> <h3>Leandro Lopes</h3> <div class="meta">23 de Julho de 2020 as 13:20</div> <p>Eu fui e o dia estava a nosso favor. Com um estonteante céu azul e um sol maravilhoso a Praia do Forte estava ótima. Areia fina e branquinha. Amei.</p> <p><a href="#" class="reply">Resposta</a></p> </div> </li> </ul> </li> </ul> </li> </ul> </li> <!-- Fim do Comentário --> <div class="comment-form-wrap pt-5"> <h3 class="mb-5">Deixe um comentário</h3> <form action="#" class="p-5 bg-light"> <div class="form-group"> <label for="name">Nome *</label> <input type="text" class="form-control" id="name"> </div> <div class="form-group"> <label for="email">Email *</label> <input type="email" class="form-control" id="email"> </div> <div class="form-group"> <label for="website">Website</label> <input type="url" class="form-control" id="website"> </div> <div class="form-group"> <label for="message">Mensagem</label> <textarea name="" id="message" cols="30" rows="10" class="form-control"></textarea> </div> <div class="form-group"> <input type="submit" value="Enviar Comentário" class="btn py-3 px-4 btn-primary"> </div> </form> </div> </div> </div> <!-- col-md-8 --> <div class="col-lg-4 sidebar ftco-animate"> <div class="sidebar-box"> <form action="#" class="search-form"> <div class="form-group"> <span class="icon fa fa-search"></span> <input type="text" class="form-control" placeholder="Pesquise aqui"> </div> </form> </div> <div class="sidebar-box ftco-animate"> <div class="categorias"> <h3>Categorias</h3> <li><a href="#">Properties <span>(12)</span></a></li> <li><a href="#">Home <span>(22)</span></a></li> <li><a href="#">House <span>(37)</span></a></li> <li><a href="#">Villa <span>(42)</span></a></li> <li><a href="#">Apartment <span>(14)</span></a></li> <li><a href="#">Condominium <span>(140)</span></a></li> </div> </div> <!--Começo Blog--> <div class="sidebar-box ftco-animate"> <h3>Blog Recentes</h3> <div class="block-21 mb-4 d-flex"> <a class="blog-img mr-4" style="background-image: url(images/imagem_1.jpg);"></a> <div class="text"> <h3 class="heading"><a href="#">Pontos Turísticos de Cabo Frio</a></h3> <div class="meta"> <div><a href="#"><span class="icon-calendar"></span> 21 de Julho 2020</a></div> <div><a href="#"><span class="icon-chat"></span> 5</a></div> </div> </div> </div> <div class="block-21 mb-4 d-flex"> <a class="blog-img mr-4" style="background-image: url(images/imagem_2.jpg);"></a> <div class="text"> <h3 class="heading"><a href="#">Pontos Turísticos de Natal-RN</a></h3> <div class="meta"> <div><a href="#"><span class="icon-calendar"></span> 07 de Agosto 2020</a></div> <div><a href="#"><span class="icon-chat"></span> 5</a></div> </div> </div> </div> <div class="block-21 mb-4 d-flex"> <a class="blog-img mr-4" style="background-image: url(images/imagem_3.jpg);"></a> <div class="text"> <h3 class="heading"><a href="#">Pontos Turisticos de Florianópolis-SC</a></h3> <div class="meta"> <div><a href="#"><span class="icon-calendar"></span> 20 de Setembro 2020</a></div> <div><a href="#"><span class="icon-chat"></span> 5</a></div> </div> </div> </div> </div> <!--Final Blogs recentes--> </div> </div> </section> <!-- section --> <footer class="ftco-footer ftco-bg-dark ftco-section"> <div class="container"> <div class="row mb-5"> <div class="col-md"> <div class="ftco-footer-widget mb-4"> <h2 class="ftco-heading-2">Site Ah Bordo</h2> <p>Ah Bordo oferece a você a melhor experiencia. Mostrando os melhores lugares e hospedagens sensacionais onde o conforto e segurança são os pontos principais. Venha fazer parte dessa equipe.</p> <ul class="ftco-footer-social list-unstyled float-md-left float-lft mt-5"> <li class="ftco-animate"><a href="#"><span class="icon-twitter"></span></a></li> <li class="ftco-animate"><a href="#"><span class="icon-facebook"></span></a></li> <li class="ftco-animate"><a href="#"><span class="icon-instagram"></span></a></li> </ul> </div> </div> <div class="col-md"> <div class="ftco-footer-widget mb-4 ml-md-5"> <h2 class="ftco-heading-2">Links Úteis</h2> <ul class="list-unstyled"> <li><a href="#" class="py-2 d-block">Blog</a></li> <li><a href="#" class="py-2 d-block">Pousadas</a></li> <li><a href="#" class="py-2 d-block">Facilidades</a></li> <li><a href="#" class="py-2 d-block">Cartão Fidelidade</a></li> </ul> </div> </div> <div class="col-md"> <div class="ftco-footer-widget mb-4"> <h2 class="ftco-heading-2">Categorias</h2> <ul class="list-unstyled"> <li><a href="#" class="py-2 d-block">Carreira</a></li> <li><a href="#" class="py-2 d-block">Sobre nós</a></li> <li><a href="#" class="py-2 d-block">Contato</a></li> <li><a href="#" class="py-2 d-block">Serviços</a></li> </ul> </div> </div> <div class="col-md"> <div class="ftco-footer-widget mb-4"> <h2 class="ftco-heading-2">Tire suas Dúvidas</h2> <div class="block-23 mb-3"> <ul> <li><span class="icon icon-map-marker"></span><span class="text">Rede Cidadã - Av. dos Andradas, N°302 Centro Belo Horizonte-MG, CEP:30120-010</span></li> <li><a href="#"><span class="icon icon-phone"></span><span class="text">(31) 3531-6620</span></a></li> <li><a href="#"><span class="icon icon-envelope"></span><span class="text">ahbordo@gmail.com</span></a></li> </ul> </div> </div> </div> </div> <div class="row"> <div class="col-md-12 text-center"> <p><!-- Link back to Colorlib can't be removed. Template is licensed under CC BY 3.0. --> Copyright ©<script>document.write(new Date().getFullYear());</script> Todos os direitos reservados <i class="icon-heart color-danger" aria-hidden="true"></i> by <a href="https://colorlib.com" target="_blank">Colorlib</a> <!-- Link back to Colorlib can't be removed. Template is licensed under CC BY 3.0. --></p> </div> </div> </div> </footer> <!-- loader --> <div id="ftco-loader" class="show fullscreen"><svg class="circular" width="48px" height="48px"><circle class="path-bg" cx="24" cy="24" r="22" fill="none" stroke-width="4" stroke="#eeeeee"/><circle class="path" cx="24" cy="24" r="22" fill="none" stroke-width="4" stroke-miterlimit="10" stroke="#F96D00"/></svg></div> </body> </html>
<script src="js/jquery.min.js"></script> <script src="js/jquery-migrate-3.0.1.min.js"></script> <script src="js/popper.min.js"></script> <script src="js/bootstrap.min.js"></script> <script src="js/jquery.easing.1.3.js"></script> <script src="js/jquery.waypoints.min.js"></script> <script src="js/jquery.stellar.min.js"></script> <script src="js/owl.carousel.min.js"></script> <script src="js/jquery.magnific-popup.min.js"></script> <script src="js/aos.js"></script> <script src="js/jquery.animateNumber.min.js"></script> <script src="js/bootstrap-datepicker.js"></script> <script src="js/jquery.timepicker.min.js"></script> <script src="js/scrollax.min.js"></script> <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBVWaKrjvy3MaE7SQ74_uJiULgl1JY0H2s&sensor=false"></script> <script src="js/google-map.js"></script> <script src="js/main.js"></script>

Related: See More


Questions / Comments: