Css #30
There are no files selected for viewing
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
This file contains hidden or 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
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,210 @@ | ||
| <!doctype html> | ||
| <!-- Todas as imagens devem ser reduzidas para o tamanho apropriado para agilizar o processamento, que implica em tirar todos os width das imagens. Flata slideshow --> | ||
| <html lang="br"> | ||
|
|
||
| <head> | ||
|
|
||
| <link rel="stylesheet" type="text/css" href="styles.css"> | ||
|
|
||
| <title>Portifólio - MySite</title> | ||
| <!-- <meta charset="utf-8"/> --> | ||
|
|
||
| <meta name="author" content="Nayara"> | ||
| <meta name="generator" content="Brackets"> | ||
| <meta name="keywords" content="HTML5, WoMakersCodeRJ,Front End, Desafio#2"> | ||
| <meta name="description" content="Desenvolvedora Front-end"> | ||
| <meta name="application-name" content="Desenvolvimento Profissional"> | ||
|
|
||
|
|
||
| </head> | ||
|
|
||
| <body><!--aparece na pagina--> | ||
|
|
||
| <header> | ||
| <nav><!--<div id="navegacao"> local onde é feito a navegação principal do site--> | ||
| <img src="./images/logo.png" alt="logo" width="100"/> | ||
| <ul> | ||
| <li><a href="home.html">HOME</a></li> | ||
| <li><a href="servico.html">SERVIÇOS</a></li> | ||
| <li><a href="portfolio.html">PORTFÓLIO</a></li> | ||
| <li><a href="sobre.html">SOBRE MIM</a></li> | ||
| <li><a href="contato.html">CONTATO</a></li> | ||
| </ul> | ||
| </nav><!--</div>--> | ||
| </header> | ||
|
|
||
| <main> | ||
| <!--<div class="teste"></div>--> | ||
| <div id="home"> | ||
|
There was a problem hiding this comment. Nesse caso aqui, não tem muito sentido você utilizar tanto o < |
||
| <section class="home"> | ||
| <div class="home-content" > | ||
| <img src="images/slider01.png" alt="borboleta"/> | ||
| <h2>BEM VIND@ </h2> | ||
| <h3>CURABITUR IACULIS.</h3> | ||
| <p> Vestibulum rutrum eros nec viverra convallis. Maecenas rutrum tortor in ante scelerisque, eget dictum felis egestas. | ||
| Mauris luctus mauris id ex ornare, at cursus leo dictum.</p> | ||
| </div> | ||
| </section> | ||
| </div> | ||
|
|
||
|
|
||
| <section class="servicos"> | ||
| <div class="border1"> | ||
| <h2>Serviços</h2> | ||
| <p>Duis et mauris non mi iaculis accumsan. Quisque tristique eros eu arcu aliquam dictum.</p> | ||
| </div> | ||
|
|
||
| <div class="fig"> | ||
| <figure> | ||
| <img src="images/Service1.png" class="img-redonda" alt="WebSite"/> | ||
|
|
||
| <figcaption> | ||
| <h4>WebSites</h4> | ||
| <p>Curabitur vestibulum blandit, porttitor. </p> | ||
| </figcaption> | ||
| </figure> | ||
|
|
||
| <figure> | ||
| <img src="images/Service2.png" class="img-redonda" alt="Templates"/> | ||
|
|
||
| <figcaption> | ||
| <h4>Templates</h4> | ||
| <p>balabalabala</p> | ||
| </figcaption> | ||
| </figure> | ||
|
|
||
| <figure> | ||
| <img src="images/Service3.png" class="img-redonda" alt="Temas Wordpress"/> | ||
|
|
||
| <figcaption> | ||
| <h4>Temas Wordpress</h4> | ||
| <p>vamos estudar cada vez mais e dominar o mundo </p> | ||
| </figcaption> | ||
| </figure> | ||
| </div> | ||
| </section> | ||
|
|
||
| <section class="portfolio"> | ||
| <div class="border2"> | ||
| <h2>Meus Trabalhos</h2> | ||
| <p>Duis et mauris non mi iaculis accumsan. Quisque tristique eros eu arcu aliquam dictum.</p> | ||
| </div> | ||
|
|
||
| <div id="nav-secundario"><!--<div id="navegacao"> local onde é feito a navegação, "submenu" --> | ||
| <ul> | ||
| <li><a href="tudo.html">Tudo</a></li> | ||
| <li><a href="website.html">WebSite</a></li> | ||
| <li><a href="template.png">Templates</a></li> | ||
| <li><a href="tema.html">Tema</a></li> | ||
| </ul> | ||
| </div> | ||
| <!-- por enquanto as imagens são referências para elas mesmas --> | ||
| <div class="fig"> | ||
| <figure> | ||
| <a href="images/Portfolio01.png"><img src="images/Portfolio01.png"/></a> | ||
|
|
||
| <figcaption> | ||
| <h4>Thumbnail label</h4> | ||
| <p>Thumbnail caption... </p> | ||
| </figcaption> | ||
| </figure> | ||
|
|
||
| <figure> | ||
| <a href="images/Portfolio02.png"><img src="images/Portfolio02.png"/></a> | ||
|
|
||
| <figcaption> | ||
| <h4>Thumbnail label</h4> | ||
| <p>Thumbnail caption...</p> | ||
| </figcaption> | ||
| </figure> | ||
|
|
||
| <figure> | ||
| <a href="images/Portfolio03.png"><img src="images/Portfolio03.png"/></a> | ||
|
|
||
| <figcaption> | ||
| <h4>Thumbnail label</h4> | ||
| <p>Thumbnail caption... </p> | ||
| </figcaption> | ||
| </figure> | ||
| </div> | ||
| </section> | ||
|
|
||
| <section class="sobremim"> | ||
| <div class="border1"> | ||
| <h2>Quem eu sou</h2> | ||
| <p>Duis et mauris non mi iaculis accumsan. Quisque tristique eros eu arcu aliquam dictum.</p> | ||
| </div> | ||
|
|
||
| <div class="nome"> | ||
| <img src="images/photo.png" class="img-pessoal" data-title="Joana D'arc" alt="Joana"/> | ||
| <p>Joana D'arc</p> | ||
| </div> | ||
|
|
||
| <div class="img-social"> | ||
| <a href="home.html"><img src="images/icon-facebook.png" class="link-midia" title= "Facebook" alt="facebook"/></a> | ||
|
|
||
| <a href="home.html"><img src="images/icon-twitter.png" class="link-midia" title="Instagram" alt="instagram"/></a> | ||
|
|
||
| <a href="home.html"><img src="images/icon-linkedin1.png" class="link-midia" title="Linkedin" alt="linkedin"/></a> | ||
| </div> | ||
|
|
||
|
|
||
| <h1>Sobre mim</h1> | ||
| <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut pharetra est non dui sollicitudin rhoncus. Integer ut ornare lacus, et lobortis diam. Cras gravida purus tortor. Aliquam vel nibh ligula. Nullam lacinia nisi vitae vulputate sodales. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Ut pulvinar metus id tincidunt euismod. Nulla in ex ac erat ultrices porttitor at id est. Vestibulum in malesuada erat, nec pulvinar leo. Pellentesque aliquam elementum purus, vitae porta dolor molestie sit amet. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.</p> | ||
|
|
||
| <h2>Habilidades</h2> | ||
| <!-- a barra de progresso será mostrada no css e/ou javascript --> | ||
|
|
||
| <!--<div class="progress-bar">Java Script</div> | ||
| <div class="progress-bar"> | ||
| HTML e CSS</div> | ||
| <div class="progress-bar"> | ||
| jQuery</div> | ||
| <div class="progress-bar">Wordpress</div>--> | ||
|
|
||
| <div class="progress-bar-js">Java Script</div> | ||
|
|
||
| <div class="progress-bar-HC" role="progressbar">HTML e CSS</div> | ||
|
|
||
| <div class="progress-bar-jQ">jQuery</div> | ||
|
|
||
| <div class="progress-bar-Wp">Wordpress</div> | ||
|
|
||
| </section> | ||
|
|
||
| <section class="contato"> | ||
| <div class="border2"> | ||
| <h2>Contato</h2> | ||
| <p>Duis et mauris non mi iaculis accumsan. Quisque tristique eros eu arcu aliquam dictum.</p> | ||
| </div> | ||
|
|
||
| <div id="email"><a href="mailto:[email protected]">[email protected]</a></div> | ||
|
|
||
| <div id="phone"> | ||
| <a href="tel:+5522999999999">+55 22 999999999</a> | ||
|
|
||
| </div> | ||
|
|
||
| <div class="border3"> | ||
| <p>Mídias</p> | ||
| </div> | ||
|
|
||
| <!-- buscar por imagens --> | ||
| <div class="img-social"> | ||
| <a href="home.html"><img src="images/icon-facebook.png" alt="facebook" width="50" color="white"/></a> | ||
|
|
||
| <a href="home.html"><img src="images/icon-twitter.png" alt="instagram" width="50"/></a> | ||
|
|
||
| <a href="home.html"><img src="images/icon-linkedin1.png" alt="linkedin" width="50"/></a> | ||
|
|
||
|
|
||
| </div> | ||
| </section> | ||
|
|
||
| </main> | ||
|
|
||
| <footer> | ||
| <p>Women + Tech = < /strong ></p> | ||
| </footer> | ||
|
|
||
| </body> | ||
| </html> | ||
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Uh oh!
There was an error while loading. Please reload this page.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Nayara, essas tags precisam ser fechadas, pra isso basta colocar barra no final, exemplo:
<meta name="application-name" content="Desenvolvimento Profissional" />