-
-
Save anonymous/437301753d5cbac21c63e7fbc2c4ed6f to your computer and use it in GitHub Desktop.
Flexbox página
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!doctype html> | |
| <html> | |
| <head> | |
| <meta charset="utf-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1"> | |
| <title>Alurinha | Cursos online</title> | |
| <style> | |
| /* http://meyerweb.com/eric/tools/css/reset/ | |
| v2.0 | 20110126 | |
| License: none (public domain) | |
| */ | |
| html, body, div, span, applet, object, iframe, | |
| h1, h2, h3, h4, h5, h6, p, blockquote, pre, | |
| a, abbr, acronym, address, big, cite, code, | |
| del, dfn, em, img, ins, kbd, q, s, samp, | |
| small, strike, strong, sub, sup, tt, var, | |
| b, u, i, center, | |
| dl, dt, dd, ol, ul, li, | |
| fieldset, form, label, legend, | |
| table, caption, tbody, tfoot, thead, tr, th, td, | |
| article, aside, canvas, details, embed, | |
| figure, figcaption, footer, header, hgroup, | |
| menu, nav, output, ruby, section, summary, | |
| time, mark, audio, video { | |
| margin: 0; | |
| padding: 0; | |
| border: 0; | |
| font-size: 100%; | |
| font: inherit; | |
| vertical-align: baseline; | |
| } | |
| /* HTML5 display-role reset for older browsers */ | |
| article, aside, details, figcaption, figure, | |
| footer, header, hgroup, menu, nav, section { | |
| display: block; | |
| } | |
| body { | |
| line-height: 1; | |
| } | |
| ol, ul { | |
| list-style: none; | |
| } | |
| blockquote, q { | |
| quotes: none; | |
| } | |
| blockquote:before, blockquote:after, | |
| q:before, q:after { | |
| content: ''; | |
| content: none; | |
| } | |
| table { | |
| border-collapse: collapse; | |
| border-spacing: 0; | |
| } | |
| body { | |
| background-color: #F2F5F7; | |
| font-family: 'Open Sans',Arial,sans-serif; | |
| } | |
| .container { | |
| width: 94%; | |
| margin: 0 auto; | |
| } | |
| .cabecalhoPrincipal { | |
| background-color: #FFF; | |
| padding: 20px 0; | |
| } | |
| .cabecalhoPrincipal-titulo { | |
| font-weight: bold; | |
| font-size: 2em; | |
| margin-bottom: 20px; | |
| } | |
| .cabecalhoPrincipal-titulo a { | |
| text-decoration: none; | |
| color: inherit; | |
| } | |
| .cabecalhoPrincipal-nav-link { | |
| padding: 10px; | |
| margin-bottom: 10px; | |
| color: #9799A6; | |
| background-color: #FFF; | |
| text-decoration: none; | |
| transition: .5s; | |
| display: block; | |
| border-bottom: 1px solid #9799A6; | |
| } | |
| .conteudoPrincipal { | |
| margin-top: 20px; | |
| margin-bottom: 20px; | |
| } | |
| .subtitulo { | |
| font-weight: bold; | |
| font-size: 32px; | |
| margin-bottom: 10px; | |
| text-align: center; | |
| } | |
| .conteudoPrincipal-cursos-link { | |
| height: 100px; | |
| background-color: #FFF; | |
| text-align: center; | |
| margin: 1%; | |
| transition: .3s; | |
| box-shadow: 2px 2px 2px #CCC; | |
| position: relative; | |
| } | |
| .conteudoPrincipal-cursos-link a { | |
| text-decoration: none; | |
| color: #000; | |
| font-weight: bold; | |
| display: block; | |
| width: 100%; | |
| height: 100%; | |
| position: absolute; | |
| top: 0; | |
| left: 0; | |
| } | |
| .conteudoPrincipal-cursos-link:hover { | |
| box-shadow: 4px 4px 4px #CCC; | |
| } | |
| .conteudoPrincipal-cursos-link a:before { | |
| content: ''; | |
| display: block; | |
| width: 50px; | |
| height: 50px; | |
| margin: 10px auto; | |
| } | |
| .conteudoPrincipal-cursos-link:nth-child(even) a:before { | |
| background: url(../img/background1.svg) no-repeat; | |
| } | |
| .conteudoPrincipal-cursos-link:nth-child(odd) a:before { | |
| background: url(../img/background2.svg) no-repeat; | |
| } | |
| .rodapePrincipal { | |
| background-color: #324C64; | |
| padding-top: 20px; | |
| } | |
| .rodapePrincipal .subtitulo { | |
| color: #FFF; | |
| } | |
| .rodapePrincipal-navMap-link { | |
| text-decoration: none; | |
| color: #FFF; | |
| margin-top: 10px; | |
| } | |
| .rodapePrincipal-navMap-link { | |
| font-size: .9em; | |
| } | |
| .navmap-list-title { | |
| font-weight: 700; | |
| font-size: 1.3em; | |
| margin: .9em 0; | |
| padding-left: .3em; | |
| padding-top: .2em; | |
| padding-bottom: .2em; | |
| } | |
| .navmap-list-title + .rodapePrincipal-navMap-link { | |
| margin-top: 0; | |
| } | |
| .navmap-list-title-bancoDeDados { color: #EC6E5A; border-left: 4px solid #EC6E5A; } | |
| .navmap-list-title-framework { color: #AD85BF; border-left: 4px solid #AD85BF; } | |
| .navmap-list-title-frontend { color: #5EC6F3; border-left: 4px solid #5EC6F3; } | |
| .navmap-list-title-backend { color: #25D285; border-left: 4px solid #25D285; } | |
| .rodapePrincipal-patrocinadores { | |
| margin-top: 30px; | |
| background: #F2F5F7; | |
| padding: 20px 0; | |
| } | |
| .rodapePrincipal-contatoForm { | |
| margin-top: 20px; | |
| text-align: center; | |
| } | |
| .rodapePrincipal-contatoForm label[for=email-contato] { | |
| font-weight: bold; | |
| font-size: 14px; | |
| color: #000; | |
| margin-bottom: 5px; | |
| display: block; | |
| } | |
| .rodapePrincipal-contatoForm-emailInput { | |
| border-top-left-radius: 5px; | |
| border-bottom-left-radius: 5px; | |
| padding: 10px; | |
| } | |
| .rodapePrincipal-contatoForm-submit { | |
| border-top-right-radius: 5px; | |
| border-bottom-right-radius: 5px; | |
| background-color: #4DBA7A; | |
| color: #FFF; | |
| cursor: pointer; | |
| } | |
| .rodapePrincipal-contatoForm-submit, | |
| .rodapePrincipal-contatoForm-emailInput { | |
| outline: 0; | |
| border: 1px solid #4DBA7A; | |
| box-sizing: border-box; | |
| font-size: 16px; | |
| } | |
| .videoSobre { | |
| background-color: #5E9EDC; | |
| padding: 25px 0; | |
| } | |
| .videoSobre-video { | |
| max-width: 100%; | |
| } | |
| .videoSobre .container { | |
| color: #FFF; | |
| } | |
| .videoSobre-sobre-title { | |
| font-size: 1.2em; | |
| font-weight: bolder; | |
| } | |
| .videoSobre-sobre { | |
| font-size: 1.3em; | |
| line-height: 2; | |
| } | |
| .videoSobre-button { | |
| border-radius: 8px; | |
| background-color: #ec6e5a; | |
| display: block; | |
| color: #FFF; | |
| border: none; | |
| height: 50px; | |
| font-size: .8em; | |
| outline: none; | |
| } | |
| .rodapePrincipal-contatoForm-legend { | |
| margin-bottom: 10px; | |
| } | |
| @media(min-width: 769px) { | |
| .container { | |
| width: 85%; | |
| } | |
| .subtitulo { | |
| text-align: left; | |
| } | |
| .cabecalhoPrincipal-nav-link { | |
| border-radius: 5px; | |
| border: 1px solid #9799A6; | |
| } | |
| .cabecalhoPrincipal-nav-link:hover { | |
| color: #FFF; | |
| background-color: #9799A6; | |
| } | |
| .cabecalhoPrincipal-titulo { | |
| margin: 0; | |
| } | |
| .cabecalhoPrincipal-nav { | |
| width: auto; | |
| } | |
| .cabecalhoPrincipal-nav-link { | |
| width: auto; | |
| margin: 0 0 0 10px; | |
| } | |
| .rodapePrincipal-contatoForm { | |
| margin-top: 0; | |
| text-align: left; | |
| } | |
| .conteudoPrincipal-cursos-link:nth-child(3n) { | |
| margin-right: 0; | |
| } | |
| .conteudoPrincipal-cursos-link:nth-child(3n+1) { | |
| margin-left: 0; | |
| } | |
| } | |
| @media(min-width: 1000px) { | |
| .conteudoPrincipal-cursos-link { | |
| margin: 1.333%; | |
| } | |
| .conteudoPrincipal-cursos-link:nth-child(3n) { | |
| margin-right: 1.33%; | |
| } | |
| .conteudoPrincipal-cursos-link:nth-child(3n+1) { | |
| margin-left: 1.333%; | |
| } | |
| .conteudoPrincipal-cursos-link:nth-child(4n) { | |
| margin-right: 0; | |
| } | |
| .conteudoPrincipal-cursos-link:nth-child(4n+1) { | |
| margin-left: 0; | |
| } | |
| .videoSobre-sobre { | |
| margin-left: 1.5em; | |
| } | |
| } | |
| body { | |
| background-color: #F2F5F7; | |
| font-family: 'Open Sans',Arial,sans-serif; | |
| } | |
| .container { | |
| width: 94%; | |
| margin: 0 auto; | |
| } | |
| .cabecalhoPrincipal { | |
| background-color: #FFF; | |
| padding: 20px 0; | |
| } | |
| .cabecalhoPrincipal-titulo { | |
| font-weight: bold; | |
| font-size: 2em; | |
| margin-bottom: 20px; | |
| } | |
| .cabecalhoPrincipal-titulo a { | |
| text-decoration: none; | |
| color: inherit; | |
| } | |
| .cabecalhoPrincipal-nav-link { | |
| padding: 10px; | |
| margin-bottom: 10px; | |
| color: #9799A6; | |
| background-color: #FFF; | |
| text-decoration: none; | |
| transition: .5s; | |
| display: block; | |
| border-bottom: 1px solid #9799A6; | |
| } | |
| .conteudoPrincipal { | |
| margin-top: 20px; | |
| margin-bottom: 20px; | |
| } | |
| .subtitulo { | |
| font-weight: bold; | |
| font-size: 32px; | |
| margin-bottom: 10px; | |
| text-align: center; | |
| } | |
| .conteudoPrincipal-cursos-link { | |
| height: 100px; | |
| background-color: #FFF; | |
| text-align: center; | |
| margin: 1%; | |
| transition: .3s; | |
| box-shadow: 2px 2px 2px #CCC; | |
| position: relative; | |
| } | |
| .conteudoPrincipal-cursos-link a { | |
| text-decoration: none; | |
| color: #000; | |
| font-weight: bold; | |
| display: block; | |
| width: 100%; | |
| height: 100%; | |
| position: absolute; | |
| top: 0; | |
| left: 0; | |
| } | |
| .conteudoPrincipal-cursos-link:hover { | |
| box-shadow: 4px 4px 4px #CCC; | |
| } | |
| .conteudoPrincipal-cursos-link a:before { | |
| content: ''; | |
| display: block; | |
| width: 50px; | |
| height: 50px; | |
| margin: 10px auto; | |
| } | |
| .conteudoPrincipal-cursos-link:nth-child(even) a:before { | |
| background: url(../img/background1.svg) no-repeat; | |
| } | |
| .conteudoPrincipal-cursos-link:nth-child(odd) a:before { | |
| background: url(../img/background2.svg) no-repeat; | |
| } | |
| .rodapePrincipal { | |
| background-color: #324C64; | |
| padding-top: 20px; | |
| } | |
| .rodapePrincipal .subtitulo { | |
| color: #FFF; | |
| } | |
| .rodapePrincipal-navMap-link { | |
| text-decoration: none; | |
| color: #FFF; | |
| margin-top: 10px; | |
| } | |
| .rodapePrincipal-navMap-link { | |
| font-size: .9em; | |
| } | |
| .navmap-list-title { | |
| font-weight: 700; | |
| font-size: 1.3em; | |
| margin: .9em 0; | |
| padding-left: .3em; | |
| padding-top: .2em; | |
| padding-bottom: .2em; | |
| } | |
| .navmap-list-title + .rodapePrincipal-navMap-link { | |
| margin-top: 0; | |
| } | |
| .navmap-list-title-bancoDeDados { color: #EC6E5A; border-left: 4px solid #EC6E5A; } | |
| .navmap-list-title-framework { color: #AD85BF; border-left: 4px solid #AD85BF; } | |
| .navmap-list-title-frontend { color: #5EC6F3; border-left: 4px solid #5EC6F3; } | |
| .navmap-list-title-backend { color: #25D285; border-left: 4px solid #25D285; } | |
| .rodapePrincipal-patrocinadores { | |
| margin-top: 30px; | |
| background: #F2F5F7; | |
| padding: 20px 0; | |
| } | |
| .rodapePrincipal-contatoForm { | |
| margin-top: 20px; | |
| text-align: center; | |
| } | |
| .rodapePrincipal-contatoForm label[for=email-contato] { | |
| font-weight: bold; | |
| font-size: 14px; | |
| color: #000; | |
| margin-bottom: 5px; | |
| display: block; | |
| } | |
| .rodapePrincipal-contatoForm-emailInput { | |
| border-top-left-radius: 5px; | |
| border-bottom-left-radius: 5px; | |
| padding: 10px; | |
| } | |
| .rodapePrincipal-contatoForm-submit { | |
| border-top-right-radius: 5px; | |
| border-bottom-right-radius: 5px; | |
| background-color: #4DBA7A; | |
| color: #FFF; | |
| cursor: pointer; | |
| } | |
| .rodapePrincipal-contatoForm-submit, | |
| .rodapePrincipal-contatoForm-emailInput { | |
| outline: 0; | |
| border: 1px solid #4DBA7A; | |
| box-sizing: border-box; | |
| font-size: 16px; | |
| } | |
| .videoSobre { | |
| background-color: #5E9EDC; | |
| padding: 25px 0; | |
| } | |
| .videoSobre-video { | |
| max-width: 100%; | |
| } | |
| .videoSobre .container { | |
| color: #FFF; | |
| } | |
| .videoSobre-sobre-title { | |
| font-size: 1.2em; | |
| font-weight: bolder; | |
| } | |
| .videoSobre-sobre { | |
| font-size: 1.3em; | |
| line-height: 2; | |
| } | |
| .videoSobre-button { | |
| border-radius: 8px; | |
| background-color: #ec6e5a; | |
| display: block; | |
| color: #FFF; | |
| border: none; | |
| height: 50px; | |
| font-size: .8em; | |
| outline: none; | |
| } | |
| .rodapePrincipal-contatoForm-legend { | |
| margin-bottom: 10px; | |
| } | |
| @media(min-width: 769px) { | |
| .container { | |
| width: 85%; | |
| } | |
| .subtitulo { | |
| text-align: left; | |
| } | |
| .cabecalhoPrincipal-nav-link { | |
| border-radius: 5px; | |
| border: 1px solid #9799A6; | |
| } | |
| .cabecalhoPrincipal-nav-link:hover { | |
| color: #FFF; | |
| background-color: #9799A6; | |
| } | |
| .cabecalhoPrincipal-titulo { | |
| margin: 0; | |
| } | |
| .cabecalhoPrincipal-nav { | |
| width: auto; | |
| } | |
| .cabecalhoPrincipal-nav-link { | |
| width: auto; | |
| margin: 0 0 0 10px; | |
| } | |
| .rodapePrincipal-contatoForm { | |
| margin-top: 0; | |
| text-align: left; | |
| } | |
| .conteudoPrincipal-cursos-link:nth-child(3n) { | |
| margin-right: 0; | |
| } | |
| .conteudoPrincipal-cursos-link:nth-child(3n+1) { | |
| margin-left: 0; | |
| } | |
| } | |
| @media(min-width: 1000px) { | |
| .conteudoPrincipal-cursos-link { | |
| margin: 1.333%; | |
| } | |
| .conteudoPrincipal-cursos-link:nth-child(3n) { | |
| margin-right: 1.33%; | |
| } | |
| .conteudoPrincipal-cursos-link:nth-child(3n+1) { | |
| margin-left: 1.333%; | |
| } | |
| .conteudoPrincipal-cursos-link:nth-child(4n) { | |
| margin-right: 0; | |
| } | |
| .conteudoPrincipal-cursos-link:nth-child(4n+1) { | |
| margin-left: 0; | |
| } | |
| .videoSobre-sobre { | |
| margin-left: 1.5em; | |
| } | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <header class="cabecalhoPrincipal"> | |
| <div class="container"> | |
| <h1 class="cabecalhoPrincipal-titulo"> | |
| <a href="#">Alurinha</a> | |
| </h1> | |
| <nav class="cabecalhoPrincipal-nav"> | |
| <a class="cabecalhoPrincipal-nav-link" href="#">Home</a> | |
| <a class="cabecalhoPrincipal-nav-link" href="#">Cursos</a> | |
| <a class="cabecalhoPrincipal-nav-link" href="#">Sobre nós</a> | |
| <a class="cabecalhoPrincipal-nav-link" href="#">Contato</a> | |
| <a class="cabecalhoPrincipal-nav-link cabecalhoPrincipal-nav-link-app" href="#">Nosso APP</a> | |
| </nav> | |
| </div> | |
| </header> | |
| <main class="conteudoPrincipal"> | |
| <div class="container"> | |
| <h2 class="subtitulo">Nossos cursos</h2> | |
| <nav> | |
| <ul class="conteudoPrincipal-cursos"> | |
| <li class="conteudoPrincipal-cursos-link"> | |
| <a href="#">Java</a> | |
| </li> | |
| <li class="conteudoPrincipal-cursos-link"> | |
| <a href="#">PHP</a> | |
| </li> | |
| <li class="conteudoPrincipal-cursos-link"> | |
| <a href="#">Ruby on Rails</a> | |
| </li> | |
| <li class="conteudoPrincipal-cursos-link"> | |
| <a href="#">.NET</a> | |
| </li> | |
| <li class="conteudoPrincipal-cursos-link"> | |
| <a href="#">Pascal</a> | |
| </li> | |
| <li class="conteudoPrincipal-cursos-link"> | |
| <a href="#">Flexbox</a> | |
| </li> | |
| <li class="conteudoPrincipal-cursos-link"> | |
| <a href="#">Desenvolvimento Web</a> | |
| </li> | |
| <li class="conteudoPrincipal-cursos-link"> | |
| <a href="#">Java Web</a> | |
| </li> | |
| <li class="conteudoPrincipal-cursos-link"> | |
| <a href="#">Javascript</a> | |
| </li> | |
| <li class="conteudoPrincipal-cursos-link"> | |
| <a href="#">AngularJS</a> | |
| </li> | |
| <li class="conteudoPrincipal-cursos-link"> | |
| <a href="#">TDD com C</a> | |
| </li> | |
| <li class="conteudoPrincipal-cursos-link"> | |
| <a href="#">Redes de computadores</a> | |
| </li> | |
| <li class="conteudoPrincipal-cursos-link"> | |
| <a href="#">MySQL</a> | |
| </li> | |
| <li class="conteudoPrincipal-cursos-link"> | |
| <a href="#">MariaDB</a> | |
| </li> | |
| <li class="conteudoPrincipal-cursos-link"> | |
| <a href="#">Postegres</a> | |
| </li> | |
| <li class="conteudoPrincipal-cursos-link"> | |
| <a href="#">Lógica de programação</a> | |
| </li> | |
| <li class="conteudoPrincipal-cursos-link"> | |
| <a href="#">Lógica de programação</a> | |
| </li> | |
| <li class="conteudoPrincipal-cursos-link"> | |
| <a href="#">Lógica de programação</a> | |
| </li> | |
| </ul> | |
| </nav> | |
| </div> | |
| <section class="videoSobre"> | |
| <div class="container"> | |
| <iframe class="videoSobre-video" width="560" height="315" src="https://www.youtube.com/embed/bIlOsJzBVaY?list=PLh2Y_pKOa4UcF1BYPJR3EIMRi3nWAUxIp" | |
| frameborder="0" allowfullscreen></iframe> | |
| <div class="videoSobre-sobre"> | |
| <h2 class="videoSobre-sobre-title">Vantagens do Alurinha</h2> | |
| <ul class="videoSobre-sobre-list"> | |
| <li class="videoSobre-sobre-item">Estude onde quiser</li> | |
| <li class="videoSobre-sobre-item">Novos cursos todos os meses</li> | |
| <li class="videoSobre-sobre-item">Cursos compatíveis com o mercado</li> | |
| </ul> | |
| <button class="videoSobre-button">Cadastre-se já</button> | |
| </div> | |
| </div> | |
| </section> | |
| </main> | |
| <footer class="rodapePrincipal"> | |
| <div class="container"> | |
| <section class="rodapePrincipal-navMap"> | |
| <h3 class="subtitulo">Mapa de cursos</h3> | |
| <nav class="rodapePrincipal-navMap-list"> | |
| <h4 class="navmap-list-title navmap-list-title-backend">Linguagens Backend</h4> | |
| <a class="rodapePrincipal-navMap-link" href="#">Java</a> | |
| <a class="rodapePrincipal-navMap-link" href="#">PHP</a> | |
| <a class="rodapePrincipal-navMap-link" href="#">Pascal</a> | |
| <a class="rodapePrincipal-navMap-link" href="#">Scala</a> | |
| <a class="rodapePrincipal-navMap-link" href="#">Python</a> | |
| <a class="rodapePrincipal-navMap-link" href="#">Java Web</a> | |
| <a class="rodapePrincipal-navMap-link" href="#">Assembly</a> | |
| <a class="rodapePrincipal-navMap-link" href="#">Lógica de programação</a> | |
| <h4 class="navmap-list-title navmap-list-title-frontend">Linguagens Frontend</h4> | |
| <a class="rodapePrincipal-navMap-link" href="#">Flexbox</a> | |
| <a class="rodapePrincipal-navMap-link" href="#">Desenvolvimento Web</a> | |
| <a class="rodapePrincipal-navMap-link" href="#">Javascript</a> | |
| <a class="rodapePrincipal-navMap-link" href="#">AngularJS</a> | |
| <a class="rodapePrincipal-navMap-link" href="#">ReactJS</a> | |
| <a class="rodapePrincipal-navMap-link" href="#">Polymer</a> | |
| <h4 class="navmap-list-title navmap-list-title-framework">Frameworks</h4> | |
| <a class="rodapePrincipal-navMap-link" href="#">Ruby on Rails</a> | |
| <a class="rodapePrincipal-navMap-link" href="#">VRaptor</a> | |
| <a class="rodapePrincipal-navMap-link" href="#">SpringMVC</a> | |
| <a class="rodapePrincipal-navMap-link" href="#">NodeJS</a> | |
| <a class="rodapePrincipal-navMap-link" href="#">Django</a> | |
| <a class="rodapePrincipal-navMap-link" href="#">Bootstrap3</a> | |
| <h4 class="navmap-list-title navmap-list-title-bancoDeDados">Banco de dados</h4> | |
| <a class="rodapePrincipal-navMap-link" href="#">MySQL</a> | |
| <a class="rodapePrincipal-navMap-link" href="#">MariaDB</a> | |
| <a class="rodapePrincipal-navMap-link" href="#">Postegres</a> | |
| </nav> | |
| </section> | |
| </div> | |
| <section class="rodapePrincipal-patrocinadores"> | |
| <div class="container"> | |
| <ul class="rodapePrincipal-patrocinadores-list"> | |
| <li> | |
| <a class="rodapePrincipal-patrocinadores-list-link patrocinadores-list-link-alura" href="#"> | |
| <img src="https://www.alura.com.br/assets/img/alura-logo.1473714412.svg" alt="Logo da Alura"> | |
| </a> | |
| </li> | |
| <li> | |
| <a class="rodapePrincipal-patrocinadores-list-link patrocinadores-list-link-caelum" href="#"> | |
| <img src="https://www.alura.com.br/assets/img/footer/caelum-logo.1473714412.svg" alt="Logo da Caelum"> | |
| </a> | |
| </li> | |
| <li> | |
| <a class="rodapePrincipal-patrocinadores-list-link patrocinadores-list-link-casaDoCodigo" href="#"> | |
| <img src="https://cdn.shopify.com/s/files/1/0155/7645/t/223/assets/c-d-c-logo.svg?7937016140355620661" alt="Logo da Casa do Código"> | |
| </a> | |
| </li> | |
| </ul> | |
| <form class="rodapePrincipal-contatoForm" action="#"> | |
| <fieldset> | |
| <legend class="rodapePrincipal-contatoForm-legend" for="email-contato">Entre em contato conosco</legend> | |
| <div class="rodapePrincipal-contatoForm-fieldset"> | |
| <input class="rodapePrincipal-contatoForm-emailInput" type="email" name="email-contato" id="email-contato"> | |
| <button class="rodapePrincipal-contatoForm-submit" type="submit">Enviar</button> | |
| </div> | |
| </fieldset> | |
| </form> | |
| </div> | |
| </section> | |
| </footer> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment