Existem três maneiras possíveis de adicionar sua folha de estilo ao seu documento HTML;
CSS embutido
Para estilizar um elemento HTML individual, a abordagem CSS em linha é usada. Esta técnica utiliza o atributo de estilo de uma tag html para incluir CSS. A definição de estilo especificada no atributo de estilo só afetará esse elemento específico.
Sintaxe
Vamos explorar e entender a técnica CSS embutida com a ajuda de alguns exemplos.
Exemplo 1
Suponha que você queira estilizar
No exemplo acima, usamos o atributo de estilo do
Saída
Definimos a cor do caminho para o roxo, a família para "Times New Roman" e o alinhamento de texto ao centro.
Exemplo 2
No exemplo acima, estilizamos um texto simples usando CSS embutido. No exemplo seguinte, iremos estilizar um CSS em linha.
Este exemplo demonstra o uso de CSS embutido.
No exemplo acima, definimos o preenchimento, a borda e a cor de fundo do elemento usando a seguinte peça de código.
Este exemplo demonstra o uso de CSS embutido.
Saída
É assim que você pode estilizar elementos como ou
Usando a abordagem CSS embutida.
Agora que temos um bom entendimento do conceito sobre CSS em linha, vamos passar por alguns prós e contras da técnica em discussão.
Prós de CSS em linha
Aqui listamos algumas vantagens de CSS em linha.
Contras do CSS embutido
Aqui listamos algumas desvantagens de CSS em linha.
Conclusão
CSS embutido é uma técnica para incluir folhas de estilo em um documento HTML usando o atributo de estilo do elemento. O CSS embutido permite que o usuário estilize os elementos individualmente e a definição de estilo especificada afetará apenas esse elemento específico. Neste post, a técnica CSS em linha foi discutida em detalhes com a ajuda de exemplos apropriados, além disso, vantagens e desvantagens da técnica em discussão também são destacadas.