Ir para conteúdo
Ruy Hoffmann

Http Tabelas ou ... ?

Recommended Posts

Bom dia pessoal,

 

Sou novato e estou montando meu primeiro site em html.  Cheguei na parte de dispor as imagens dos produtos, legendas e um botão "alugar". A disposição da tela quero algo igual ao site da americanas, extra, ml, ou seja, pequena figura do produto em linha uma ao lado da outra, abaixo de cada figura uma legenda em texto, abaixo de cada legenda  um botão "alugar". Formando um bloco de 4 a 5 produtos começa tudo de novo logo abaixo num novo bloco horizontal de produtos..

 

Olhando esses sites me parece uma Tabela sem bordas sendo utilizada.

 

Então a pergunta é devo utilizar Tabela no Html ou devo seguir por outro caminho?

Compartilhar este post


Link para o post
Compartilhar em outros sites

Ruy, tudo bem?

Ao conjunto que você ver nesses sites, é que é utilizado HTML e CSS para fazer a manipulação,

N caso do site Americanas eles não utiliza Tabela e sim utilizam o CSS para manipular a DIV a responder de acordo com a formatação.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Oi Francklyn, tudo bem sim,

 

Primeiro obrigado pela sua ajuda!!! :) tentei dar um "like" na sua mensagem mas dá erro.

 

Entendi, sem Tabelas. Eu estou fazendo "aulas online" e já fechou a parte de CSS. Consegui fazer o código abaixo que resulta em 3 figuras lado-a-lado na horizontal e duas linhas de textos abaixo das figuras, mas achei trabalhoso, imagine eu ter 300 produtos e ter que fazer o mesmo linha a linha.... bem como nem finalizei, ainda quero botar um botão "Alugar" abaixo dos textos... enfim... acho que estou fazendo pelo caminho mais trabalhoso.

 

Bom, se você ou algum outro colega esbarrar em algum tutorial, video-aula ou coisa assim que exemplifique justamente isso posta aqui o link por favor.

Veja o que fiz de teste, até deu certo, mas dezenas de códigos digitados só para colocar 3 produtos apenas, tenho mais 297 para colocar!!!:

 

HTML

<section id="capas"> <!--INI: Essa seção adiciona as capas dos jogos, lado a lado - Ruy Hoffmann 03/02/2019-->
    <div class="capas">
    <img src="file:///D:/Ruy/2019/Locadora/HTML/_jogos/PS4Spide-man.jpg" title="Spider-Man" hspace="25">
    <p>Homem Aranha</p>
    <p>Disponível</p>
    </div>
    <!--figcaption>
    <p>Homem Aranha</p>
    </figcaption-->
    <div class="capas">
    <img src="file:///D:/Ruy/2019/Locadora/HTML/_jogos/PS4TheLastOfUs.jpg" title="The Last of Us" hspace="25">
    <p>The Last of Us</p>
    <p>Disponível</p>
    </div>
    <!--figcaption>
    <p>The Last Of Us</p>
    </figcaption-->
    <div class="capas">
    <img src="file:///D:/Ruy/2019/Locadora/HTML/_jogos/PS4ResidentEvil2.jpg" title="Resident Evil 2" hspace="25">
    <p>Resident Evil 2</p>
    <p>Disponível</p>
    <!--figcaption>
    <p>Resident Evil 2</p>
    </figcaption-->    
    </div>
</section>

 

CSS

/*CAPAS - Ruy Hoffmann 06/02/2019 */
div.capas
{
    width:150px;
    display: inline-block;
    margin:0px 25px 0px 0px;
    padding-bottom:0px;
    padding-top:0px;
}
div.capas p
{
    padding-bottom:0px;
    padding-top:0px;
    margin:0px 0px 0px 25px;
    font-size:12pt;
    font-weight:bold;
}

/* RODAPÉ */
footer
{
    background-color:black;
}
footer h6
{
    padding:5px;
}
 

 

Compartilhar este post


Link para o post
Compartilhar em outros sites

Crie uma conta ou entre para comentar

Você precisar ser um membro para fazer um comentário

Criar uma conta

Crie uma nova conta em nossa comunidade. É fácil!

Crie uma nova conta

Entrar

Já tem uma conta? Faça o login.

Entrar Agora

  • Conteúdo Similar

    • Por Luiz Fernando 111
      Caros amigos, estou tentando adicionar soma entre inputs do html e do javascript, mas com esse exemplo, apenas consegui colocar no input do html. Como faço para implementar no input do javascript e somar o valor junto com o Valor Total mostrar lucro quando foi debito e prejuizo quando for crédito ? Alguém poderia me dá help !!!
       
       

    • Por allancisneiro
      pessoal boa tarde, estou construindo um arquivo HTML, porém estou com um problema de alinhamento do texto apartir do segundo<H1>.  já tentei  usar o comando align:"left". mas não funcionu.
      quem puder ajudar agradeço. a ideia é alinhar tudo à esquerda
       
      este arquivo contém este código-fonte:
       
      <!DOCTYPE html>
      <html>
      <head>
      <title>Título da página</title>
      <meta charset="utf-8"/>
      </head>
      <body>
      <h1>Lista não ordenada</h1>
      <ul>
      <li>LIVERPOOL</li>
      <li>CHELSEA</li>
      <li>MANCHESTER CITY</li>
      <li>MANCHESTER UNITED</li>
      <li>ARSENAL</li>
      <li>TOTTENHAM</li>

      <h1 align="left">Lista ordenada</h1>
      <OL>
      <li>LIVERPOOL</li>
      <li>CHELSEA</li>
      <li>MANCHESTER CITY</li>
      <li>MANCHESTER UNITED</li>
      <li>ARSENAL</li>
      <li>TOTTENHAM</li>

      </OL>
          
      </body>
      </html>

    • Por Robson Augusto
      Galera se alguém souber o que ocorre,  é o seguinte, não acredito que possa ser Problema de SEO, mas vamos lá meu site anuncicarbh.com, não aparece em pesquisa feitas pelo computador, com a palavra chave "seminovos bh", ele aparece na primeira oscilando para segunda pagina do bing e yahoo, fazendo a pesquisa pelo telefone, ja no pc ele nao aparace mais no yahoo, mas continua a aparecer no bing, ja no google ele teve pequenas aparições na terceira página, agora em ambas as pesquisas de pc e celular ja não aparece mais no google... So aparece atualmente no google, pesquisando pelo nome do site... Alguem saberia me dizer o por que disso? será SEO?
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.