[HTML] Preciso fazer um parágrafo que abra o conteúdo ao ser clicado! - Programação web - Clube do Hardware
Preciso fazer um parágrafo que abra o conteúdo ao ser clicado!
HTML Preciso fazer um parágrafo que abra o conteúdo ao ser clicado!
Por Bruno Wrezinski, 6 de setembro de 2017 em Programação web
Bruno Wrezinski 2
Preciso fazer isso aí (Imagem logo abaixo). O problema é que estou começando com html. Isto é para um trabalho da faculdade, preciso fazer isso, sem CSS, puro html.
@Bruno Wrezinski Olá, Seja bem vindo em nosso Clube do Hardware.
Não sei se entendi, mas esse elemento parece ser o "select" com seus "options".
Lembre, que não damos códigos prontos. Por isso, poste aqui uma tentativa.
6 horas atrás, DiF disse:
Olá. Talvez pode ser o select sim, mas não entendi como usá-lo. A ideia é quando clicar na setinha, no conteúdo "minha infância", abrir um conteúdo e ao clicar nela novamente, o conteúdo esconder-se. Seria um dropdown, só que não posso usar CSS, nem JS. É pra ser puramente html no site.
@Bruno Wrezinski impossível. Vamos por partes. HTML nada faz sozinho. Ele serve apenas para colocar cada quadrado no seu lugar. O CSS serve para estilizar o html e dar certa "dinamicidade" no conteúdo. Javascript será usado para interação usuário e página navegada. No teu caso, única solução seria, sem css e js, usar um select mas seriam opções e não conteúdo dinâmico.
<option value="4">Nenhuma das opções</option>
Agora, é extremamente fácil criar algo assim até mesmo usando puramente o css. Dá uma estudada sobre html, css e javascript, entenda realmente o que cada um funciona e então você vai ver que o que está pedindo é realmente fácil.
@Bruno Wrezinski
É como já foi dito.
Pelo que você descreve, inicialmente a pessoa pensa que é o efeito de show e hide de conteúdos. Que só dá para fazer usando o JS OU usando o terceiro nível do CSS ( CSS3 - animations)
Então como você não pode usar o JS, resta imaginar que o elemento é o select. ou seja, um elemento que possui opções para selecionar, exatamente como o @Felipe Paz postou acima.
Obrigado gente, vou ver como consigo resolver, Obrigado pela rapidez nas respostas!
Pessoal, consegui encontrar a tag que eu queria, depois de muito esforço, talvez eu não tenha me expressado direito quando informei o que eu precisava. Enfim segue imagens do que eu precisava, consegui fazer isso com a tag <details>. Obrigado pela ajuda!!
@Bruno Wrezinski Muito interessante a solução encontrada. Não é à toa que não conhecia.
Eu ainda não conheço todos os elementos do HTML 5.
O "maujor" explica muito bem o que é o details, como e quando utilizar. Além disso ensina como estilizar no css caso precise.