Solucionado (ver solução)
Solucionado
(ver solução)
7
respostas

Tags

Formatei o código do blog da forma abaixo. Minha pergunta é: o trecho "Por que fazer páginas acessíveis?" eu coloquei na tag strong, também tem necessidade de colocar uma tag

antes da para dizer que é um novo paragarafo?

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>Blog - Joao da Silva</title>
        <link rel="icon" href="favicon.png">
    </head>    

    <body>
        <h1>Blog</h1>

        <h2> O essencial de design responsivo</h2>

        <p>Design responsivo tem ganho cada vez mais atenção como técnica de desenvolvimento de páginas web 
        para dispositivos móveis. Mas como começar?</p>

        <strong>Por que fazer páginas acessíveis?</strong>

        <p>Tem se falado cada vez sobre <em>acessibilidade</em> na web. Há diversas técnicas e diretivas a serem seguidas, 
        inclusive da própria W3C. Mas vale a pena investir nisso?</p>

        <strong>JavaScript não obstrusivo</strong>

        <p>JavaScript é uma linguagem essencial hoje em dia para criar páginas ricas, interativas e dinâmicas. Porém, 
        há alguns cuidados que devem ser tomados ao colocarmos código JavaScript em nossas páginas.</p>
    </body>
</html>
7 respostas

A tag <b> deixa tudo em Negrito assim como ficou seu texto e o meu.

Pera, entendi a pergunta agora. Você pode usar a tag <br> no lugar da <p> pra começar uma nova linha.

Acho que voce nao entendeu minha pergunta. Quero saber como o navegador entendeu que tinha que pular a linha quando tinha que escrever o trecho Por que fazer páginas acessíveis?, se nao usei a tag

nem . Mesmo assim ele pulou a linha

provavelmente por causa da tag

<p></p>

nos parágrafos anteriores e posteriores...

Janile Oliveira,

Isso aconteceu porque você escreveu "Porque fazer página acessíveis?" fora da tag

Como você fez:

<p>Design responsivo tem ganho cada vez mais atenção como técnica de desenvolvimento de páginas web 
        para dispositivos móveis. Mas como começar?</p>

        <strong>Por que fazer páginas acessíveis?</strong>

        <p>Tem se falado cada vez sobre <em>acessibilidade</em> na web. Há diversas técnicas e diretivas a serem seguidas, 
        inclusive da própria W3C. Mas vale a pena investir nisso?</p>

Como você poderia fazer:

<p>Design responsivo tem ganho cada vez mais atenção como técnica de desenvolvimento de páginas web 
        para dispositivos móveis. Mas como começar?

        <strong>Por que fazer páginas acessíveis?</strong>

        Tem se falado cada vez sobre <em>acessibilidade</em> na web. Há diversas técnicas e diretivas a serem seguidas, 
        inclusive da própria W3C. Mas vale a pena investir nisso?</p>

Outro ponto de atenção está na sua tag meta, para evitar problemas de exibição de caracteres especias.

Como você fez:

<meta charset="utf-8">

Como você poderia fazer:

<meta charset="utf-8" />
solução!

Oi Janile, tudo bom?

Complementando a resposta dos colegas acima...

A tag p que representa um parágrafo no mundo HTML é do tipo block, enquanto a tag strong é do tipo inline!

Mas o que é block e inline?

Uma tag do tipo block irá ocupar toda a largura disponível para ela, ou seja, ela irá se esticar da esquerda para direita o máximo possível! (você consegue visualizar isso utilizando o inspecionar do navegador, clicando em uma setinha no canto superior esquerdo. Ele automaticamente mostrará o espaço que cada elemento ocupa a medida que você passa o mouse por cima do elemento)

Já a tag do tipo inline só irá ocupar a largura que ela realmente precisa, diferentemente do tipo block. (veja inspecionando o elemento strong!)

Então, no seu caso, a quebra de linha se dá justamente por causa do tipo das tags. Ao colocar uma tag p (block), ela irá ocupar toda a largura da página, "forçando" uma quebra de linha, fazendo com que o elemento imediatamente após (tag strong) comece da linha abaixo! O comportamento de "se esticar" faz com que mesmo depois de uma tag inline, haja a quebra de linha.

É sempre bom lembrar que podemos utilizar tags inline dentro de tags block sem que haja qualquer problema como esse como foi feito com a tag em

Esse fiddle pode te ajudar!

fiddle de demonstração block

fiddle de demonstração inline

Espero que não tenha ficado muito confuso, mas se ficou alguma dúvida ainda não deixe de perguntar!

Espero também ter ajudado e contribuído para sua jornada.

Abraços!

Oi janile em HTML temos elementos que são elementos de linha e elementos que são em bloco, a tag <p> é um elemento em bloco sempre antes de começar e depois que ela encerra tem uma ESPAÇAMENTO que o navegador coloca automaticamente de linha, já a tag strong é elemento de linha se ela tivesse envolvida com a tag p ela apareceria em linha no elemento de bloco, como ela está após o elemento de bloco ela aparece sozinha, e depois que ela encerra temos um novo p que por ser elemento de bloco aparece em uma nova linha.

Obs: A tag meta não precisa de fechamento.

Espero ter ajudado e bons estudos.

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software