Ser capaz de estilizar diferentes aspectos de sua página HTML é uma habilidade importante para web designers e desenvolvedores. Para estilizar suas páginas da Web em HTML com cores e tamanhos de natividade, você precisa estar familiarizado com CSS. Para segmentar o tamanho da natividade especificamente, você pode usar o CSS tamanho da natividade propriedade.
Se você está procurando uma maneira de mudar o tamanho da natividade HTML usando CSS, nós o cobrimos. Vamos reprofundar começando com uma introdução ao CSS tamanho da natividade propriedade.
Entendendo a propriedade font-size do CSS
O tamanho da natividade propriedade em CSS é útil quando você precisa mudar o tamanho do texto HTML. Você pode usar essa propriedade para mudar o tamanho de cada segmento do texto em uma página HTML ou direcionar elementos específicos a serem alterados.
A segmentação de elementos específicos geralmente é recomendada, pois normalmente você não deseja que tudo tenha o mesmo tamanho. O texto que não segue uma jerarquia visual é difícil de examinar e diferenciar os títulos de nível superior dos de nível subalterno.
Em termos mais simples, não abuse do tamanho da natividade propriedade. Se você deseja que um título se destaque, existem diferentes tags de título HTML para isso. Confira nossa folha de dicas de fundamentos HTML para diferentes tags, atributos e muito mais, além de explicações.
O CSS tamanho da natividade propriedade recebe dois tipos de valores: absolutos e relativos.
Valores de comprimento inteiro (ou seja px) são fixos enquanto os relativos (por exemplo em e ex) são flexíveis. Por exemplo, para uma unidade relativa à natividade uma vez que em, o tamanho geralmente é determinado pelo tamanho da natividade do elemento pai. No entanto, unidades relativas a fontes baseadas em raiz, uma vez que rem são influenciados pelo tamanho da natividade do elemento raiz ().
Cada um tem seus prós e contras, mas na origem de manter as coisas focadas, não vamos discuti-los neste cláusula.
Porquê mudar o tamanho da natividade de um elemento HTML em CSS
Você pode mudar o tamanho da natividade do texto HTML usando alguma sintaxe CSS padrão.
Primeiro, especifique o seletor (o texto que você deseja modificar) e abra algumas chaves. A seguir, insira o tamanho da natividade seguido por dois pontos, especifique o tamanho específico em que você deseja que seu texto HTML seja apresentado e feche-o com um ponto e vírgula.
Cá está a sintaxe:
CSS selector {
font-size: value;
}Para entender melhor o noção, revise o seguinte clichê HTML que tem algumas linhas de código adicionais (um título e um parágrafo):
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Simple HTML Page</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<h1>This is my first heading</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
</body>
</html>
Se você quiser mudar o tamanho da natividade do elemento de parágrafo, você precisa selecioná-lo (através de uma classe, tag ou id) e, usando o CSS tamanho da natividade propriedade, defina um valor personalizado com suas unidades preferidas. Em nosso exemplo, usaremos pixels (px).
p {
font-size: 18px;
}Embora o CSS encastoado geralmente não seja recomendado em projetos grandes, você também pode usá-lo para mudar o tamanho do texto HTML. Tomando notas do código CSS extrínseco supra, podemos implementar a mesma coisa inline assim:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Simple HTML Page</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<h1>This is my first heading</h1>
<p style="font-size:18px">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
</body>
</html>
Texto no p A tag HTML agora terá um novo tamanho personalizado.
Solucionando problemas de erros ao mudar o tamanho da natividade HTML em CSS
Embora todo o processo de mudança do tamanho do texto em CSS possa parecer fácil, nem sempre pode ser exatamente uma vez que você espera. Se você tiver problemas, comece verificando se você salvou as alterações em seu registo (também, certifique-se de vincular sua folha CSS ao seu registo HTML). Se sim, tente usar o método encastoado e atualize a página.
Se funcionar, pode possuir um problema com seu código CSS. Experimente usar o !importante tag, e se funcionar, deve possuir qualquer código conflitante. Analise seu código CSS risca por risca para tentar conquistar esse erro.
Leia a seguir
Sobre o responsável
