0

Tenho uma pagina chamada de noticias.html com várias notícias divididas em vários artigos, mas só falta os links dessa parte que ta escrita "CONTINUE LENDO..." que eu gostaria de fazer com que ao clicar nessa parte a notícia abrisse toda com o restante das informações

Meu código é esse:

section {
  width: 80%;
  margin: 0 auto;
  background-color: #dedede;
}

article {
  width: 200px;
  height: 200px;
  background-color: yellow;
  display: inline-block;
  margin-left: 10px;
}

a {
  display: block;
  width: 100%;
  height: 10px;
  border-radius: 7px;
  text-decoration: none;
  background-color: red;
  display: table;
  position: relative;
  top: 150px;
}

h2 {
  width: 100px;
  height: 100px;
  border: 1px solid black;
}
<section>
  <article>Notícia 01
    <a href="">continue lendo...</a>
  </article>

  <article>Notícia 02
    <a href="">continue lendo...</a>
  </article>

  <article>Notícia 03
    <a href="">continue lendo...</a>
  </article>

  <article>Notícia 04
    <a href="">continue lendo...</a>
  </article>

</section>

inserir a descrição da imagem aqui

9
  • Quando você diz "a notícia abrisse toda", você quer dizer que deseja que esse contêiner expanda o seu tamanho, ou você quer que a notícia seja aberta em outra página? 11/12/2018 às 23:17
  • acho que ela abrir em outra pagina seria melhor ... 11/12/2018 às 23:24
  • @GustavoSampaio gostaria de uma ajuda nessa parte . eu vejo em muitos sites de notícias mais não sei como e que funciona isso alguém me ajudem por favor 11/12/2018 às 23:29
  • qual o padrão usado pelo os sites de notícias ? 11/12/2018 às 23:45
  • 1
    <a target="_blank" href="link_da_notícia.html">CONTINUE LENDO...</a>
    – Sam
    12/12/2018 às 2:16

1 Resposta 1

1

Se seu botão CONTINUE LENDO... for um elemento <a>, é só adicionar o atributohref, direcionando para a página da notícia em questão, conforme o que o @hugocsl falou. Já se for um elemento <button>, você pode adicionar o atributo onclick, para que quando o botão for clicado, a página da notícia em questão seja aberta, através da declaração exemplificada pelo @OtavioCapel, ou através do método open, também pertencente ao objeto window, da seguinte forma:

Abre a notícia em outra guia

window.open('link_da_noticia');

ou

Abre a notícia na mesma guia

window.open('link_da_noticia', '_self');

Isso tudo considerando que você quer abrir a notícia em uma outra página.

Qual o padrão usado pelos sites de notícias?

Contando o exemplo que você forneceu, com mais outros dois exemplos que procurei, acho que o padrão deles é abrir a notícia em outra página, porém na mesma guia.

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 .