JStudioMesanino

Postagens

Mostrando postagens de setembro, 2017

Exemplo ToolTip, Popover

setembro 22, 2017

Exemplo ToolTip e PopoVer no Bootstrap Exemplo mostra uso de ToolTip e Popover, que são detalhes mostrados, ao parar seta do mouse sobre o botão, caixa de mensagem. Imagem Exemplo. Para Maiores informações, pesquise no site Oficial do BootStrap ( Link ). Foi acrescentado novo script para essa funcionalidade se encontra no final do código. como apresentado no Site. Segue Código Fonte do Exemplo. <body> <div class="container"> <div class="page-header"> <h1>ToolTip BootStrap & Popover</h1> </div> <h3>ToolTip</h3> <button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="top" title="Detalhes">Dica</button><br><br> <div class="btn-toolbar"> <div class="btn-group"...

Leia mais

Alerts

setembro 22, 2017

Exemplo Uso de Alert. Exemplo mostra o uso de alert, e opções para leitores visuais_Digitais (Acessibilidade). Imagen Exemplo. Observar com atenção, pois exitem novos recursos no código voltado a acessibilidade. Código Fonte Exemplo. <div class="container"> <div class="page-header"><h1>- Alert Bootstrap </h1></div>  <div class="alert alert-success" role="alert"> <strong>success</strong> teste!!! <button type="button" class="close" data-dismiss="alert" aria-lable="Fechar"> <span aria-hidden="true">×</span> </button> </div> ...

Leia mais

Modal exemplo Bootstrap

setembro 22, 2017

Exemplo mostra o Uso de modal. Modal é um recurso bem interessante, neste exemplo mostra o uso de suas janelas. Este exemplo esta no Site do BootStrap - JavaScript - Modal. Imagem de Exemplo. Ao Clicar abre janela com efeito !!! Código fonte: <div class="container"> <div class="page-header"><h1>- Bootstrap Modal</h1></div> <button type="button" class="btn btn-info" data-toggle="modal" data-target="#janela"> Logar </button>  <form class="modal fade" id="janela"> <div class="modal-dialog modal-sm"> <div class="modal-content">  ...

Leia mais

Conhecendo os Glyphicons

setembro 22, 2017

Exemplo de Uso Icones? (Glyphicons) Neste exemplo mostra o uso de fontes Glyphicons, as fontes estão no site do BootStrap- Componentes. link ( Seguir para Site ). Imagem Exemplo. Código Fonte do Exemplo. <div class="container"> <div class="page-header"><h1>-Bootstrap Glyphicons (Icones)</h1></div> <h3><span class="glyphicon glyphicon-user"></span> Icone de Cabeçalho</h3> <br> <a href="Http://www.google.com/">Lixeira <span class="glyphicon glyphicon-trash"></span></a> <br> <p style="color:blue; font-size:20px;"> <span class="glyphicon glyphicon-signal"></span></p> <br> ...

Leia mais

Exemplo Barra de Navegação

setembro 21, 2017

Exemplo Barra de Navegação com Bootstrap. Exemplo mostra o uso de classes do bootstrap na criação da barra de navegação. Copia Imagem do exemplo. Layout Responsivel, com Botao de Menu. Código Fonte; <nav class="navbar navbar-default"> <div class="container"> <div class="navbar-reader"> <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#barra-navegacao"> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> ...

Leia mais

Exemplos de Imagens Bootstrap !!!

setembro 21, 2017

Exemplo do uso de Imagens no BootStrap. Código Fonte Exemplo: <div class="container "> <div class="page-header"><h1>Imagens Bootstrap</h1></div> <div class="row"> <div class="col-sm-6"> <h3>Imagen Responsiva</h3> <img src="img/uvas.png" class="img-responsive img-circle" ></div> <div class="col-sm-6"> <h3>Imagen Normal</h3> <img src="img/uvas.png"></div> </div>  <div class="row"> <div class="col-sm-12"> <h3>Formas em Imagens</h3> <img src="img/uvas200.png" class="i...

Leia mais

Botões Bootstrap Exemplos.

setembro 21, 2017

Exemplo de Botões no Bootstrap! Exemplo se uso de botões no bootstrap, segue abaixo código fonte: <div class="container "> <div class="page-header"> <h1>Botões Bootstrap</h1> </div> <div class="row"> <div class="col-sm-6"> <h3>Botões Padrão</h3> <a href="#" class="btn btn-default">Botão link</a> <input type="submit" class="btn btn-default" value="Botão"> <button class="btn btn-default">Botão Button</button> </div> ...

Leia mais