Scribd
Carregar
776 visualizações2 páginas

Exercício Prático de HTML CSS Bootstrap

Este documento fornece instruções para construir uma nova interface de formulário de avaliação usando o framework Bootstrap, separando-a em 4 seções (Importação de arquivo, Informações Gerais, Avaliação do Profissional e Conclusão) em 4 arquivos HTML distintos e unindo-os em abas.

Enviado por

Vi Ruiz
Direitos autorais
© © All Rights Reserved
Levamos muito a sério os direitos de conteúdo. Se você suspeita que este conteúdo é seu, reivindique-o aqui.
Formatos disponíveis
Baixe no formato PDF, TXT ou leia on-line no Scribd
776 visualizações2 páginas

Exercício Prático de HTML CSS Bootstrap

Este documento fornece instruções para construir uma nova interface de formulário de avaliação usando o framework Bootstrap, separando-a em 4 seções (Importação de arquivo, Informações Gerais, Avaliação do Profissional e Conclusão) em 4 arquivos HTML distintos e unindo-os em abas.

Enviado por

Vi Ruiz
Direitos autorais
© © All Rights Reserved
Levamos muito a sério os direitos de conteúdo. Se você suspeita que este conteúdo é seu, reivindique-o aqui.
Formatos disponíveis
Baixe no formato PDF, TXT ou leia on-line no Scribd
Você está na página 1/ 2

Exerccio prtico de HTML CSS Bootstrap

Esta a interface grfica antiga do formulrio de avaliao:


Construir uma interface nova utilizando o framework Bootstrap. Esta interface nova deve ser separada em 4 sees:

Importao de arquivo, Informaes Gerais, Avaliao do Profissional e Concluso.

1 - Construa as 4 abas das funcionalidades em uma pgina inicial (veja o exemplo no cdigo abaixo).

2 - Separar estas quatro sees em 4 arquivos distintos dentro do projeto.

3 - Unir todos os arquivos em cada seo de uma aba.

Para auxlio no exerccio, use a documentao do Bootstrap: http://getbootstrap.com/components/#nav-tabs

<ul class="nav nav-tabs" role="tablist">


<li role="presentation" class="active">
<a href="#passo1" data-toggle="tab" aria-controls="passo1" role="tab" title="Step 1">
<span class="round-tab">
<i class="glyphicon glyphicon-folder-open"></i>
</span>
</a>
</li>
<li role="presentation">
<a href="#passo2" data-toggle="tab" aria-controls="passo2" role="tab" title="Step 2">
<span class="round-tab">
<i class="glyphicon glyphicon-tags"></i>
</span>
</a>
</li>
</ul>

<div class="tab-content">
<div class="tab-pane active" role="tabpanel" id="passo1">
<h1>Tab1</h1>
</div>
<div class="tab-pane" role="tabpanel" id="passo2">
<h1>Tab2</h1>
</div>

</div>

Você também pode gostar