Embedded Files
No CSS, existem várias propriedades que permitem formatar e personalizar textos em uma página. Com elas, é possível ajustar a fonte, o tamanho, o espaçamento, o alinhamento e até adicionar efeitos visuais, deixando o conteúdo mais legível e com identidade visual.
color: define a cor do texto.
font-style: define o estilo da fonte.
Valores: normal, italic, oblique.
font-family: especifica a família da fonte de um elemento.
Exemplos: Brush Script MT, Arial, Times New Roman, Helvetica, Courier New, Verdana, Arial Narrow, Candara, Calibri, Cambria, Garamond.
font-size: define o tamanho do texto.
font-weight: define a espessura dos caracteres.
Valores comuns: normal (400), bold (700), lighter, bolder.
letter-spacing: define o espaço entre caracteres.
hyphens: controla a hifenização automática de palavras.
Valor mais usado: auto.
line-height: define o espaço entre linhas.
Exemplo: 1.5.
text-align: define o alinhamento do texto.
Valores: left, right, center, justify.
text-decoration: adiciona linhas decorativas ao texto.
Exemplos: underline, underline dotted, underline wavy, overline.
É possível também definir cor da decoração.
text-indent: define o recuo da primeira linha de um parágrafo.
text-transform: controla a capitalização do texto.
Valores: capitalize, uppercase, lowercase.
capitalize → coloca a primeira letra de cada palavra em maiúscula.
Exemplo: "css é incrível" → "Css É Incrível"
uppercase → transforma todo o texto em maiúsculas.
Exemplo: "css é incrível" → "CSS É INCRÍVEL"
lowercase → transforma todo o texto em minúsculas.
Exemplo: "CSS É INCRÍVEL" → "css é incrível"
Efeitos de Texto no CSS
Efeitos de Texto no CSS
O CSS oferece propriedades que permitem criar efeitos visuais avançados em textos, trazendo mais destaque e estilo. Entre elas estão:
-webkit-text-stroke-width
Define a espessura do contorno do texto. Funciona como um traço ao redor das letras.
Exemplo:
-webkit-text-stroke-width: 2px; (cria um contorno de 2 pixels de largura)
-webkit-text-stroke-color
Define a cor do contorno do texto. É usada em conjunto com a largura para dar contraste.
Exemplo:
-webkit-text-stroke-width: 2px;
-webkit-text-stroke-color: black;
Esse código deixa as letras com um contorno preto de 2 pixels.
text-shadow
Adiciona sombras ao texto, permitindo criar profundidade e realce. A sintaxe básica é:
text-shadow: deslocamento-x deslocamento-y desfoque cor;
deslocamento-x: posição da sombra no eixo horizontal.
deslocamento-y: posição no eixo vertical.
desfoque: intensidade da sombra (opcional).
cor: a cor aplicada.
Exemplo:
text-shadow: 2px 2px 5px rgba(0,0,0,0.5);
Esse código cria uma sombra suave e esfumaçada atrás do texto. Em conjunto, essas propriedades permitem criar títulos com contornos, brilhos e efeitos de destaque, garantindo mais impacto visual no seu site.
Caracteres e Emojis no HTML
Caracteres e Emojis no HTML
No HTML, é possível inserir caracteres especiais e emojis usando códigos numéricos. Eles podem ser escritos de duas formas:
Decimal: começa com &# e termina com ;.
Exemplo: 😀 → 😀
Hexadecimal: começa com &#x, seguido do número em hexadecimal, e termina com ;.
Exemplo: 😀 → 😀
Esses códigos garantem que o símbolo ou emoji seja exibido corretamente, mesmo que o teclado ou fonte utilizada não os tenha disponíveis.
Para conferir mais símbolos e emojis prontos para usar, acesse bit.ly/leal-simbolos ou Aqui.
Alguns emojis que vão funcionar com um tom de pele estão listados na tabela abaixo:
Para o copyright: ©
Em HTML:
Em HTML:
© ou ©
Google Sites
Report abuse