criando espaço extra no seu HTML numa página web pode ser alcançado de muitas formas, dependendo do tipo de espaço que deseja criar. As seguintes seções contêm muitas das diferentes maneiras de criar espaço extra usando tanto HTML quanto CSS.,
criando espaços extras antes ou depois do texto
uma das coisas mais confusas para os novos usuários que estão criando uma página web é que eles não podem pressionar a barra de espaço várias vezes fazer espaços adicionais. Para criar espaços extra antes, depois Ou entre o seu texto, use o (espaço sem quebra) carácter HTML extendido.
Por exemplo, com “espaço extra” temos o seguinte código em nosso HTML.,
extra space
Se estiver a usar um editor WYSIWYG para introduzir o código acima, deverá estar na página HTML ou a editar o código HTML.
para uma lista de caracteres HTML especiais estendidos, veja: lista completa de caracteres HTML especiais EXTENDIDOS.
Manter o espaçamento no texto que é colado em uma página
Se você estiver colando texto com espaço extra, você pode usar o HTML <pre> tag para manter o texto formatado., Abaixo está um exemplo de como colar texto com espaços extra usando o ID
pre> tag.
This text has lots of spaces
o exemplo acima é feito usando o código HTML abaixo.
<pre class="tab">This text has lots of spaces</pre>
- Consulte nossa HTML <pre> página para obter mais informações sobre esta tag.
Se estiver a usar um editor WYSIWYG para introduzir o código acima, deverá estar na página HTML ou a editar o código HTML.,
criando espaço extra em torno de um elemento ou objeto
qualquer elemento HTML pode ter espaço adicional adicionado ao topo, direita, baixo ou esquerda. No entanto, certifique-se de que compreende a diferença entre margem e enchimento antes de decidir o tipo de espaço que deseja adicionar em torno do elemento ou objecto. Como se vê na figura abaixo, o estofamento envolve o elemento, dentro da fronteira, e a margem fora da fronteira.
,
um exemplo de um parágrafo com margem e estofamento.
o exemplo acima foi criado usando o código abaixo.
na primeira secção do Código, “margem-esquerda: 2.5 em;” adiciona uma margem esquerda de 2.5 em, o que dá a aparência de texto indentado. Como mostrado no exemplo, este espaçamento está fora da borda. Na próxima seção, “padding: 0 7em 2em 0;” é definir o preenchimento superior, direito, inferior e esquerdo (no sentido horário). Há” 0 ” acolchoado superior,” 7em ” acolchoado direito,” 2em ” acolchoado inferior, e 0 acolchoado esquerdo., O resto deste exemplo está a definir o aspecto da fronteira.
criar uma página usando CSS e HTML
uma página pode ser criada em HTML, ajustando a margem esquerda de um elemento. Por exemplo, este parágrafo tem uma margem esquerda de 2,5 em do elemento que contém o texto. O CSS para criar esta margem esquerda é mostrado abaixo.
.tab { margin-left: 2.5em}
Depois de colocar este código no nosso ficheiro CSS, podemos aplicar a classe “tab” a qualquer texto para criar a aparência de uma página. O valor da margem esquerda pode ser aumentado ou diminuído dependendo de suas necessidades.,
embora recomendamos o método acima, o CSS de margem esquerda também pode ser adicionado em linha como mostrado no exemplo abaixo.
<p style="margin-left:2.5em">An example of a 5em left margin.</p>
um exemplo de uma margem esquerda 5em.
- Como indentar ou tabular texto na minha página web ou em HTML?
Adicionar espaço abaixo de uma linha ou parágrafo de texto
Se você precisa adicionar espaço extra abaixo de uma linha ou parágrafo do texto, e só precisa fazer isso uma vez, você pode usar o <br> tag. Abaixo está um exemplo de como esta técnica pode ser aplicada.,
<p>This sentence contains example text.<br><br>As you can see, two breaks add the space above.</p>
o código acima cria o texto mostrado abaixo.
esta frase contém um exemplo de texto.como você pode ver, duas quebras adicionam o espaço acima.se necessário, podem ser adicionadas pausas adicionais. No entanto, sugerimos o uso do método CSS mencionado anteriormente para adicionar preenchimento e espaçamento em torno de seu texto, se for feito em vários lugares em uma página.
Informação adicional
- como alinhar o texto numa página web em HTML ou CSS.
- Como criar texto HTML não formatado.
- veja a nossa definição de espaço branco para mais informações e links relacionados.,
- HTML e web design help and support.