Como colocar texto itálico no HTML ou CSS?
Aprenda na prática e com exemplo a colocar os textos do seu website em itálico usando HTML ou CSS.
PUBLICADO POR AYLTON INACIO
Tutoriais e Artigos > Websites e SEO
Se você está começando com HTML é comum se perguntar como colocar itálico nos textos, mas isso também é comum entre os mais experientes pela dificuldade em memorizar.
Lembrando que estamos falando de formatação de textos, então o mais indicado é fazer esse trabalho com instruções CSS, porque HTML deve ser usado apenas para montar a estrutura e definição dos elementos.
Mas a formatação básica, como é o caso do itálico ou negrito, é permitida e indicada em HTML pela semântica dos elementos. Vamos ver isso usando HTML e também CSS.
Colocando texto em itálico com HTML
O elemento HTML <i> define um texto em itálico e é indicado para apresentar um termo técnico,
uma palavra em outro idioma ou um pensamento.
Já o elemento HTML <em> define um texto enfatizado. Na prática ele também é renderizado como itálico,
mas pela semântica dos elementos, um leitor de tela pode pronunciar a palavra em ênfase verbal.
Colocando texto em itálico com CSS
A instrução CSS font-style: italic; faz a formatação do texto com itálico. Por exemplo,
você pode criar a classe italic e aplicar nos elementos HTML desejados.
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<title>Título da página</title>
<style>
.italic{
font-style: italic;
}
</style>
</head>
<body>
<h2>Itálico com HTML</h2>
<p>Este texto é comum, mas <em>este</em> está em <i>itálico</i>.</p>
<h2>Itálico com CSS</h2>
<p>Este texto é comum, mas <span class='italic'>este</span> está em <span class='italic'>itálico</span>.</p>
</body>
</html>
Então é isso, eu espero que você tenha gostado desta publicação. Fique à vontade para compartilhar nas suas redes sociais para ajudar na divulgação e crescimento do site.
Aproveite para se inscrever no meu canal do YouTube e também na News do site pra ficar por dentro das novidades em artigos, tutoriais e cursos online.
Abraço e até a próxima!
