Latest web development tutorials

Perfil Bootstrap

O que é Bootstrap?

Bootstrap é uma estrutura de front-end para o desenvolvimento rápido de aplicações Web e Web sites. Bootstrap é baseado em HTML, CSS, JavaScript do.

história

Inicializar porMark OttoeJacob Thorntondesenvolvimentodo Twitter.Bootstrap é agosto 2011 publicada no Github produtos de código aberto.

Por Bootstrap?

  • Móvel Em primeiro lugar: desde Bootstrap 3 em diante, o quadro inclui bibliotecas em toda a prioridade de dispositivos móveis de estilo.
  • suporte ao navegador: Todos os principais navegadores suportam Bootstrap.

    Internet ExplorerFirefoxOperaGoogle ChromeSafari

  • Fácil de usar: contanto que você tenha um conhecimento básico de HTML e CSS, você pode começar a aprender Bootstrap.
  • design responsivo: Bootstrap CSS Responsive capaz de desktops adaptativos, tablets e telefones celulares.Para mais informações sobre design responsivo, disponível design responsivo Bootstrap .

    design responsivo

  • Ele desenvolvedores a criar interface simples fornece uma solução unificada.
  • Inclui um poderoso componentes integrados, fáceis de personalizar.
  • Ele também fornece personalização baseado na Web.
  • É open source.

conteúdo do pacote Bootstrap

  • A estrutura básica: Bootstrap fornece a estrutura de base do fundo do estilo ligação com um sistema de rede.Isto será explicado em detalheBootstrap porção básica.
  • CSS: Bootstrap vem com as seguintes características: configurações CSS global, definir os estilos básicos de elementos HTML, classe escalável, e um sistema de rede avançada.Esta seção irá explicar em detalhe oBootstrap CSS.
  • Componentes: Bootstrap contém uma dúzia de componentes reutilizáveis para criação de imagens, menus, navegação, caixa de pop-up de alerta caixa de e assim por diante suspensa.Isto será explicado em pormenora disposição dos componentes.
  • Widget JavaScript: Bootstrap contém uma dúzia custom jQuery plugin.Você pode incluir todos os plug-ins, esses plug-ins também podem conter individualmente. Isto será explicado em detalhe parteBootstrap ficha.

  • Personalização: Você pode personalizar componentes Bootstrap, variáveis menos e plug-in jQuery para obter a sua própria versão.


exemplos on-line

local tutorial Bootstrap contém centenas de exemplos.

Você pode usar o nosso código editor on-line editor on-line, e clique no botão Executar para ver os resultados.

exemplos de bootstrap

<Div class = "container"> <Div class = "jumbotron"> <H1> Minha primeira página Bootstrap </ h1> <P> redefine o tamanho da janela para ver o efeito sensível! </ P> </ Div> <Div class = "linha"> <Div class = "col-sm-4 "> <H3> Coluna 1 </ h3 > <P> aprendizagem não é apenas tecnologia, mas também um sonho! </ P> <P> sonhos de novo Niubi, mas também dar forma e você gosta otário pau! </ P> </ Div> <Div class = "col-sm-4 "> <H3> Coluna 2 </ h3 > <P> aprendizagem não é apenas tecnologia, mas também um sonho! </ P> <P> sonhos de novo Niubi, mas também dar forma e você gosta otário pau! </ P> </ Div> <Div class = "col-sm-4 "> <H3> A coluna 3 </ h3 > <P> aprendizagem não é apenas tecnologia, mas também um sonho! </ P> <P> sonhos de novo Niubi, mas também dar forma e você gosta otário pau! </ P> </ Div> </ Div> </ Div>

tente »


mais exemplos

Exemplo 2 Bootstrap

<Div class = "table-responsiva"> <Table class = "table table table-listrado -bordered"> <Thead> <Tr> <Th> # </ th> <Th> Nome </ th> <Th> Rua </ th> </ Tr> </ Thead> <Tbody> <Tr> <Td> 1 </ td> <Td> Anna impressionante </ td > <Td> Broome Street </ td > </ Tr> <Tr> <Td> 2 </ td> <Td> Debbie Dallas </ td > <Td> Houston Street </ td > </ Tr> <Tr> <Td> 3 </ td> <Td> John Doe </ td > <Td> Madison Street </ td > </ Tr> </ Tbody> </ Table> </ Div>

tente »

Clique no botão "Try" para ver como ele funciona.