Como usar fontes personalizadas do fontes do site Google Web no Dreamweaver

Uma das maneiras mais fáceis de usar o Dreamweaver para adicionar fontes personalizadas para o seu site é oferecido pelo Google. Google Web Fonts oferece uma coleção limitada de fontes, mas você pode usar todas as suas fontes de graça. Siga estes passos para adicionar qualquer um dos tipos de letra a partir do site do Google Web Fonts para suas páginas:

  1. Abra um navegador web e visitar site de Fontes Web do Google.

  2. Pesquisar as fontes disponíveis no site, selecionando o tipo e estilo da fonte que você está procurando.

    Para restringir sua pesquisa, use Filtros (na coluna da esquerda). Você pode alterar o texto que é exibido em cada fonte editando o campo Texto Visualização na parte superior da tela.

    image0.jpg
  3. Encontrar uma fonte que você gosta e, em seguida, clique no botão Adicionar ao azul coleção no canto inferior direito, logo abaixo de cada nome de fonte.

  4. Clique nas caixas de seleção ao lado de cada um dos estilos de fonte que você deseja usar na sua página web.

    A maioria das fontes no diretório de fontes Google tem apenas um estilo. Embora você pode ser tentado a escolher todos os estilos, é melhor para selecionar apenas os que você vai usar. Como o Google adverte, mais estilos de fonte que você escolher, mais tempo vai demorar para baixar sua página web.

  5. Role a página e selecione a opção Latina (para Inglês).

    Se você precisar os caracteres adicionais para outro idioma, selecione a opção estendida Latina vez.

  6. Rolar parte inferior da página para a caixa azul com três Guias- clique na primeira guia para conectar a fonte para o seu site.

    Google oferece três opções: Standard, @import, e javascript. Você encontrar descrições detalhadas de todos os três no site do Google.

    image1.jpg
  7. 7. Copie o link do campo guia padrão no Google, assim como você faria para copiar qualquer outro texto ou código de uma página web.

  8. No Dreamweaver, cole o link na área da cabeça de sua página web entre as tags de abertura e fechamento.

  9. Voltar ao site Fontes web do Google e na parte inferior da página, copie o nome da família de fontes.

    Você pode encontrar o nome da família de fontes no integrar as fontes em sua área de CSS.

    Em sua definição de estilo, você deve incluir o nome da fonte exatamente como Google, escreve ele. Copiar e colar é a melhor maneira para garantir que o nome da fonte corresponde.

  10. No Dreamweaver, colar o nome da família da fonte na regra CSS em que deseja usar a fonte.

  11. Aplicar a regra ao texto em sua página web.

    Se você usar a fonte em um estilo seletor de tags, como o tag, quando você aplica a tag para texto, a fonte será aplicada automaticamente como parte da regra. Se você usar a fonte em um estilo de classe ou ID, o estilo deve então ser aplicada a uma tag que rodeia o texto, tal como um

    tag ou uma tag.

  12. Publicar a página para um servidor web e, em seguida, visualizar a página em um navegador da web para ver a fonte.

    Note que quando você usa fontes web do Google que você não pode ver a fonte exibida no Dreamweaver, mesmo se você usar a opção de o Live View. Para garantir que a fonte trabalha em sua página, você pode precisar de transferir a página para um servidor web usando FTP e visualizar a página depois de ser publicado online.

menu