Atualizado dia 24 de maio de 2018.
Melhore seu blog com simplicidade…
Já escrevi aqui sobre a diferença entre block e inline. Neste post vou dar exemplos com as tags inline, que são muito úteis na edição de qualquer texto HTML, inclusive blogs:
Negrito
Código:
Com a tag b o texto fica <b>negrito</b>.
Ou ainda:
Com a tag strong o texto fica <strong>negrito</strong>.
Resultado:
Com a tag b o texto fica negrito.
Citação*
Código:
Com a tag q o texto fica <q>entre aspas</q>.
Resultado:
Com a tag q o texto fica entre aspas
.
Itálico
Código:
Com a tag cite o texto fica <cite>itálico</cite>.
Com a tag em o texto fica <em>itálico</em>.
Com a tag i o texto fica <i>itálico</i>.
Com a tag var o texto fica <var>itálico</var>.
Com a tag dfn* o texto fica <dfn>itálico</dfn>.
Resultado:
Com a tag i o texto fica itálico.
* <dfn> não funciona no Chrome, nem no Safari.
Riscado
Código:
Com a tag del o texto fica <del>riscado</del>.
Com a tag s o texto fica <s>riscado</s>.
Resultado:
Com a tag s o texto fica riscado.
Sublinhado
Códigos:
Com a tag ins o texto fica <ins>sublinhado</ins>.
Com a tag u o texto fica <u>sublinhado</u>.
Resultado:
Com a tag u o texto fica sublinhado.
Monoespaçado
Com a tag code (código) o texto fica <code>monoespaçado</code>.
Com a tag code (código) o texto fica monoespaçado
.
Com a tag kbd (keyboard - teclado) o texto fica <kbd>monoespaçado</kbd>.
Com a tag kbd (keyboard - teclado) o texto fica monoespaçado.
Com a tag samp (exemplo) o texto fica <samp>monoespaçado</samp>.
Com a tag samp (exemplo) o texto fica monoespaçado.
Tamanho do texto
Códigos:
Com a tag small o texto fica <small>menor</small> do que estava antes.
Com a tag big o texto fica <big>maior</big> do que estava antes.
Resultado:
Com a tag small o texto fica menor do que estava antes.
Com a tag big o texto fica maior do que estava antes.
Nível do texto
Código:
Com a tag sub o texto fica <sub>um nível abaixo</sub> do que estava antes.
Com a tag sup o texto fica <sup>um nível acima</sup> do que estava antes.
Resultado:
Com a tag sub o texto fica um nível abaixo do que estava antes.
Com a tag sup o texto fica um nível acima do que estava antes.
Sentido do texto
Código:
Com a tag bdo dir="ltr" o texto fica <bdo dir="ltr">da esquerda para a direita</bdo>.
Com a tag bdo dir="rtl" o texto fica <bdo dir="rtl">da direita para a esquerda</bdo>.
Resultado:
Com bdo dir="ltr" o texto fica da esquerda para a direita.
Com bdo dir="rtl" o texto fica da direita para a esquerda.
<bdo dir="rtl">
inverte o texto para nós, ocidentais, que escrevemos da esquerda para a direita, enquanto <bdo dir="ltr">
serve para inverter textos árabes e hebraicos, por exemplo, que são escritos da direita para a esquerda.
Fonte, cor e tamanho
Código:
A tag font <font color="#ff00ff" size="4" face="comic sans ms">muda cor, tamanho e fonte</font> sem precisar de CSS.
Resultado:
A tag font muda cor, tamanho e fonte sem precisar de CSS.
Apesar de modificarem o texto sem precisar de CSS, todas essas tags podem ser personalizadas na folha de estilos de seu blog ou site para que fiquem do seu jeito.