Como fazer uma letra capitular em HTML

Escrito por sean mann | Traduzido por lucas de barros
  • Compartilhar
  • Tweetar
  • Compartilhar
  • Pin
  • E-mail
Como fazer uma letra capitular em HTML
Aprenda a fazer uma letra capital em HTML (Comstock Images/Stockbyte/Getty Images)

Adicione uma capitular a uma página na internet para fazer a primeira letra de um parágrafo parecer como as grandes letras encontradas em livros e jornais. Ela precisa ser maior do que o resto do texto e as outras letras devem ser envolvidas por ela. Pode-se implementar uma letra capitular usando um estilo CSS dentro de uma página HTML.

Nível de dificuldade:
Moderadamente fácil

Outras pessoas estão lendo

Instruções

  1. 1

    Abra um editor de HTML e carregue o arquivo no qual se deseja adicionar a capitular.

  2. 2

    Adicione uma nova folha de estilo em cascata, ou classe CSS, na parte do cabeçalho (<head>) do arquivo HTML. O importante é que o estilo "flutue" para que outro texto envolva a letra. Um exemplo de como fazer isso é com o código a seguir:

    <style type="text/css" media="all"> .my_drop_cap { float: left; line-height: 1; font-size: 4em; margin-right: 0.1em; font-weight: bold; } </style>

  3. 3

    Cerque a letra que se quer fazer uma capitular com tags "<span>", que correspondem à classe que foi criada no cabeçalho. Usando o exemplo anterior, adicione esse código na seção do corpo do HTML:

    <span class="minha_letra_capitular">M</span>y drop cap letter.

  4. 4

    Salve o arquivo HTML e carregue-o em um navegador da internet para ver a capitular.

Dicas & Advertências

  • As versões mais antigas de navegadores podem exibir determinados códigos CSS de formas inesperadas. Carregue a página HTML em vários navegadores para garantir que ela está sendo exibida corretamente.

Não perca

Filtro:
  • Geral
  • Artigos
  • Slides
  • Vídeos
Mostrar:
  • Mais relevantes
  • Mais lidos
  • Mais recentes

Nenhum artigo disponível

Nenhum slide disponível

Nenhum vídeo disponível