Scroll Top

Aprenda tudo que você precisa para criar o seu negócio na internet.  São 30 vídeos aulas totalmente gratuitas. Basta se cadastrar em um de nossos formulário.

Tutoriais

CSS espaçamento

css espaçamentoCSS espaçamento define Espaço entre letras [letter-spacing]

O espaçamento entre os caracteres de um texto é controlado pela propriedade letterspacing. O valor desta propriedade define o espaço entre os caracteres. Por exemplo, se você deseja um espaço de 3px entre as letras do texto de um parágrafo <p> e de 6px entre as letras do texto de um cabeçalho <h1> o código a seguir deverá ser usado.

Digite o código abaixo no Editor Notepad+ +  para ver como fica o css espaçamento e depois salve  no arquivo estilo.css conforme já estudamos anteriormente:

 

h1 {
letter-spacing: 6px;
}
p {
letter-spacing: 3px;
}

Agora digite o código abaixo e salve no arquivo index.html, depois abra o arquivo index.html no seu navegador e deverá aparecer uma imagem igual a que está logo abaixo do código:

<html>
<head>
<title>Meu Primeiro Estudo de CSS</title>
<link rel=”stylesheet” type=”text/css” href=”estilo.css”/>
</head>
<body>
<h1> Primeiro Cabeçalho </h1>
<p> Parágrafo Exemplo </p>
</body>
</html>

Veja como deve ficar a imagem no seu navegador:

 

css espaçamento

 

Transformação de textos [text-transform]

A propriedade text-transform controla a capitalização (tornar maiúscula) do texto. Você pode escolher capitalize, uppercase ou lowercase independentemente de como o texto foi escrito no código HTML.

Como exemplo tomamos a palavra “cabeçalho” que pode ser apresentada ao usuário como “CABEÇALHO” ou “Cabeçalho”. São quatro os valores possíveis para texttransform:

capitalize

Capitaliza a primeira letra de cada palavra. Por exemplo: “john doe” transforma-se para “John Doe”.

uppercase

Converte todas as letras para maiúscula. Por exemplo: “john doe” transforma-se para”JOHN DOE”.

lowercase

Converte todas as letras para minúscula. Por exemplo: “JOHN DOE” transforma-se para”john doe”.

none

Sem trasformações – o texto é apresentado como foi escrito no código HTML.

Para exemplificar vamos usar uma lista de nomes. Os nomes estão marcados com o elemento <li> (item de lista). Vamos supor que desejamos os nomes capitalizados e os cabeçalhos em letras maiúsculas.

Ao consultar o exemplo sugerido para este código dê uma olhada no HTML da página e observe que os textos no código foram escritos com todas as letras em minúsculas.

Digite o código abaixo no Editor Notepad+ +  e salve  no arquivo estilo.css conforme já estudamos anteriormente:

h1 {
text-transform: uppercase;
}
li {
text-transform: capitalize;
}

Agora digite o código abaixo e salve no arquivo index.html, depois abra o arquivo index.html no seu navegador e deverá aparecer uma imagem igual a que está logo abaixo do código:

<html>
<head>
<title>Meu Primeiro Estudo de CSS</title>
<link rel=”stylesheet” type=”text/css” href=”estilo.css”/>
</head>
<body>
<h1> primeiro cabeçalho </h1>
<li> parágrafo exemplo </li>
</body>
</html>

 

Veja imagem como ficou depois de abrir no seu navegador:

css espaçamento

 

Css espaçamento é um ótimo recurso para implementar os seus negócios online, pois criar uma visual moderno e bonito para o seu site. Se você quer ganhar dinheiro com trabalho em casa e criar um negocio na internet, estude e pratique tudo o que está sendo ensinado aqui neste site, e seus negócios serão um sucesso absoluto.

<<<Voltar —

 

Está Gostando do Artigo?

Se inscreva em nossa lista e receba 30 vídeos aulas grátis, ensinando como criar o seu negócio na internet a partir do zero.

| Website

Sou blogueiro por que gosto de ler e escrever. Criei este blog para te ajudar a criar o seu negócio na internet e ter um novo estilo de vida.

  • I simply want to say I’m beginner to blogging and site-building and absolutely loved this web page. Most likely I’m likely to bookmark your site . You absolutely have beneficial articles and reviews. Appreciate it for sharing with us your web site.

    Tradução:
    Eu simplesmente quero dizer que eu sou iniciante em blogs e site de construção e absolutamente Entes esta página web. O mais provável é que eu sou provavelmente para marcar o seu site. Você absolutamente tem artigos benéficos e resenhas. Apreciá-lo por compartilhar conosco o seu web site.

Por gentileza, se deseja alterar o arquivo do rodapé,
entre em contato com o suporte.
error: Este conteúdo está protegido ! Se precisar de alguma coisa envie mensagem pelo formulário de contato.