0

Boa Noite!

Queria umas dicas, ajuda, enfim, queria criar uns blocos estilo esse da imagem abaixo usando bootstrap, mas não faço ideia por onde começar, alguém pode me dar uma luz?

Obrigado!

inserir a descrição da imagem aqui

5
  • O que você não consegue fazer exatamente? Criar um bloco? Colocar os blocos lado a lado? A pergunta está ampla demais...
    – bfavaretto
    Commented 23/02/2015 às 21:24
  • Criar os blocos e coloca-los lado a lado, desculpe. Commented 23/02/2015 às 21:26
  • Você precisa dar algum ponto de partida pra gente, senão fica um pedido tipo "quero algo igual a essa imagem, alguém faz pra mim?". Já tem alguma tentativa pelo menos começada? Já trabalhou com CSS?
    – bfavaretto
    Commented 23/02/2015 às 21:27
  • Estou começando, na real eu queria igual da imagem, não quero que alguém faça, só não sei por onde começar. Commented 23/02/2015 às 21:37
  • Quem quiser dar dicas e postar tutoriais, por favor, usem a tag para isso, que é o lugar certo onde esse tipo de informação vai. Commented 23/02/2015 às 21:39

1 Resposta 1

3

Vamos lá.. o bootstrap trabalha com uma grid de 12 celulas, logo crie uma linha, onde cada celula(div) será de tamanho col-[xs ou md ou lg, fica seu critério]-3. exemplo:

<div class="row">
    <div class="col-xs-3"></div>
    <div class="col-xs-3"></div>
    <div class="col-xs-3"></div>
    <div class="col-xs-3"></div>
</div>

Veja o exemplo abaixo:

  
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css" rel="stylesheet"/>
<div class="container">
	<div class="row">
		<div class="col-xs-3">
			<div class="well well-sm">
				<dl>
				  <dt>Titulo </dt>
				  <dd>descricao </dd>
				  <dt>Titulo </dt>
				  <dd>descricao </dd>			 
				</dl>		
			</div>		
		</div>
		<div class="col-xs-3">
			<div class="well well-sm">
				<dl>
				  <dt>Titulo </dt>
				  <dd>descricao </dd>
				  <dt>Titulo </dt>
				  <dd>descricao </dd>			 
				</dl>		
			</div>		
		</div>
		<div class="col-xs-3">
			<div class="well well-sm">
				<dl>
				  <dt>Titulo </dt>
				  <dd>descricao </dd>
				  <dt>Titulo </dt>
				  <dd>descricao </dd>			 
				</dl>		
			</div>		
		</div>							
		<div class="col-xs-3">
			<div class="well well-sm">
				<dl>
				  <dt>Titulo </dt>
				  <dd>descricao </dd>
				  <dt>Titulo </dt>
				  <dd>descricao </dd>			 
				</dl>		
			</div>		
		</div>		
	</div>	
</div>

3
  • 1
    se caso o texto acima não seja satisfatório, diga aqui eu tento melhorar a resposta.. Commented 23/02/2015 às 22:01
  • Nossa, já me ajudou pra caralho, agora é só eu ir aplicando o css e testando até eu acertar hahaha Commented 23/02/2015 às 22:17
  • Boa! qualquer coisa é qualquer coisa! Commented 23/02/2015 às 22:19

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .