Neste artigo, criaremos uma informação de coluna para sua referência. O conteúdo específico é o seguinte
A ordem do Google Chrome Parsing precisa ser carregada e executada
$ (janela) .load (function () {$ ('. text'). Eq (0) .css ('margin -top', ($ ('. Auto'). Eq (0) .Height () - $ ('. Texto'). Eq (0) .Height ()) / 2 + 'px');});Nota: Para o navegador Firefox, você pode pressionar Ctrl+Shift+M para ajustar o tamanho do terminal móvel.
Pergunta do título da sub-coluna
<div> <div> <hgroup> <h1> Informações </h1> <h4> Últimas notícias, recursos, etc. de treinamento interno corporativo ... </h4> </hgroup> </div> </div>
CSS da coluna
.jumbotron {margem: 50px 0 0 0; preenchimento: 60px 0; Antecedentes: #ccc url (../ img/bg.jpg); Cor: #ccc;}. Jumbotron h1 {font-size: 26px; // 768,30; 992,33; 1200,36; preenchimento: 0 0 0 20px;}. Jumbotron h4 {font-size: 16px; // 768,16; 992,17; 1200,18 preenchimento: 0 0 20px;}Conteúdo de informação
<div id = "Information"> <div> <div> <div> <div> <div> <div> <div> <img src = "img/info1.jpg"> </div> <div> <h4> A administração do estado é baseada no Rádio, Filme e Televisão, lançado TvOS2.0 e Huawei Alibaba Participe na pesquisa e no desenvolvimento </h4 Integração de TVOS1.0, Huawei Mediaos e Alibaba Yunos. A Huawei é principalmente responsável pelo trabalho de desenvolvimento, e o Alibaba é responsável pelo shopping de TV embutido. </p> <p> Admin 15/10/11 </p> </div> </div> </div> </div> </div> <div> <blockQuote> <h2> notícias populares </h2> </lockQuote> <div> <div> <div> <div> <div> <div> <div style = "margin: 12px 0; </div> <div style = "preenchimento-right: 0"> <h4> título </h4> <p> admin 15/10/11 </p> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div>
CSS de conteúdo de informação
#Information {preenchimento: 40px 0; Antecedentes: #eee;}. Info-right {Background-Color: #ffff; Box-Shadow: 2px 2px 3px #ccc;}. Info-right blockQuote {preenchimento: 0; margem: 0;}. Info-right h2 {font-size: 20px; preenchimento: 5px;}. Info-right h4 {altura de linha: 1.6;}. Info-content {Background-Color: #ffff; Box-Shadow: 2px 2px 3px #ccc; margem: 0 0 20px 0;}. Info-content IMG {margem: 12px 0;}. Info-content H4 {font-size: 14px; // 768,16; 992,18; 1200,20; preenchimento: 2px 0 0 0;}. Info-content P {altura da linha: 1.6; Cor: #666;}Para o conteúdo do .info H4, uma linha é necessária para as telas médias e grandes.
.info-content h4 {Overflow: hidden; Espaço branco: Nowrap; Texto-overflow: elipsis;}Se você ainda deseja estudar em profundidade, pode clicar aqui para estudar e anexar 3 tópicos interessantes a você:
Tutorial de aprendizado de bootstrap
Tutorial prático de bootstrap
Tutorial de uso de plug-in bootstrap
O exposto acima é o código que eu quero fechar o conteúdo de informações da subcoluna de produção de bootstrap. Espero que todos gostem.