Declaração de direitos autorais: Os direitos autorais deste artigo pertencem ao autor original. A tradução é apenas para referência dos leitores domésticos
. Resumo deste artigo: Os truques CSS mais comumente usados, como cantos arredondados, letras maiúsculas, etc.
Houve uma tradução anterior de "8 truques CSS de uma frase" que apresentou 8 truques CSS de uma frase muito úteis. Esta semana trarei para vocês um artigo semelhante, que apresenta alguns dos truques CSS mais comumente usados, ou é chamado de. Truque CSS. Claro, acredito que todo designer terá algumas preferências pessoais. Pessoalmente, não gosto muito de alguns dos truques do artigo.
1. Não utilize o efeito de canto arredondado da imagem
.rtop, .rbottom{display:block}
.rtop *, .rbottom *{display: bloco; altura: 1px;
.r1{margem: 0 5px}
.r2{margem: 0 3px}
.r3{margem: 0 2px}
.r4{margin: 0 1px; height: 2px}
(Muitas pessoas gostam de usar essa técnica de arredondamento, mas eu pessoalmente não gosto muito dela. Apesar de não precisar fazer fotos com cantos arredondados, essas tags extras sempre parece supérfluo)
2. Lista estilizada
Esta é a linha um
Aqui está a linha dois
E última linha
ol {
fonte: itálico 1em Georgia, Times, serif;
cor: #999999;
}
ol p {
fonte: normal .8em Arial, Helvetica, sans-serif;
cor: #000000;
}
Também gosto muito desse efeito. Você pode aplicar fontes diferentes aos números de série.
3. Formulário sem tabela
4. Técnica de aspas duplas
5. Efeito de palavra gradiente
6. Centralização vertical
Para mais informações, consulte o texto original
10. Letra capitular
Este parágrafo possui a classe “introdução”. seu navegador suporta a pseudoclasse “primeira letra”, a primeira letra será uma letra maiúscula
p.introduction:first-letter {.
tamanho da fonte: 300%;
peso da fonte: negrito;
flutuar: esquerda;
largura: 1em;
}