Índice
As fontes, como vimos na Parte 1 deste Tutorial, são uma maneira muito sutil e eficaz de mudar a forma como uma página HTML você vê, nós já sabemos como usar o atributo um pouco Fonte, agora veremos as propriedades avançadas para continuar personalizando nossos documentos.Trabalhando com o tamanho da fonte
Para trabalhar com o tamanho das fontes, CSS nos permite uma série de propriedades e atributos com os quais podemos alcançar os efeitos que desejamos em nossa busca pela customização de nossos documentos.
Os seguintes atributos nos permitem realizar a mudança de tamanhos.
xx-pequeno x-pequeno pequeno médio grande x-grande xx-grande: Configurar o tamanho da fonte, o navegador é responsável por estabelecer o tamanho exato das fontes, conforme a lista de opções avança, a letra do bloco de texto ao qual a propriedade é aplicada fica maior.
menor maior: Estabelece o tamanho da fonte, o tamanho obtido é relativo ao elemento pai.
Agora vamos ver no código um exemplo de como aplicar esse novo conhecimento:
ExemploExistem muitos tipos diferentes de frutas - existem mais de 500 variedades de banana. No momento em que adicionamos os incontáveis tipos de maçãs, laranjas e outras frutas conhecidas, nos deparamos com milhares de opções.
Neste código, usamos os dois tipos de atributos, aquele identificado com o id primeiro terá um tamanho fixo e o identificador com o id segundo terá um tamanho maior em relação ao seu contêiner pai, vamos ver como fica no navegador.
Estabelecendo o estilo e o peso
O peso da fonte corresponde à espessura da linha que define a letra, podendo ser modificado com a propriedade espessura da fontePor outro lado, o estilo nos permite selecionar entre texto normal, em itálico ou também em oblíquo, vamos ver como usamos isso em um código para que possamos ir direto para a prática.
ExemploExistem muitos tipos diferentes de frutas - existem mais de 500 variedades de banana. No momento em que adicionamos os incontáveis tipos de maçãs, laranjas e outras frutas conhecidas, nos deparamos com milhares de opções.
Agora vamos ver como isso fica em nosso navegador.
No código o que fizemos foi colocar uma seção em itálico e outra em negrito ou negrito, há uma diferença entre itálico e oblíquo, porém a nível visual é algo que é desprezível no momento, também podemos deixar essa diferença a ser investigado e, portanto, o conteúdo deste tutorial está fresco na mente.Gostou e ajudou este tutorial?Você pode recompensar o autor pressionando este botão para dar a ele um ponto positivo