1. Sobre comentários
Comentários em CSS são muito importantes ao criar sites xhtml+CSS. Ao criar estilos CSS, você deve manter o hábito de comentar casualmente. Geralmente, estou acostumado a escrever comentários no formato "/* comment content*/", porque em editores com funções de destaque como o EditPlus, o "/**********" comumente usado na linguagem C é usado . Comentários como *******/" não têm sentido e não há necessidade de preencher muito conteúdo sem sentido como separação. Documentos com comentários servem como documentos CSS originais do site. Ao publicar o site, você pode usar uma ferramenta de compactação CSS para compactar o CSS e remover comentários do CSS de saída para melhorar a eficiência da transferência de arquivos.
2. Sobre nomenclatura
Ao nomear arquivos CSS, prefiro usar nomes ou abreviações em inglês semanticamente corretos. Posso usar nomes pinyin parciais para partes incomuns. Além disso, em algumas classes dependentes, posso usar um nome semelhante a "list_banner", ou seja, o nome do elemento pai mais "_" mais o nome do elemento.
Quanto à nomenclatura, ela pode ser negociada com base nos hábitos dos designers da equipe. Mas é melhor adicionar um comentário após o nome para que você possa gerar documentação para referência futura.
3. Sobre herança
Em CSS, faça bom uso da herança. Por exemplo, em dois divs aninhados, o elemento pai define o atributo background-color como preto. Se o fundo dos elementos filhos também for preto, não há necessidade de repetir a definição. Fazer bom uso da herança CSS pode tornar seu código mais eficiente e simplificado.
4. Sobre os níveis de definição de CSS
Ao definir classes em CSS, é recomendado usar uma forma hierárquica para descrever instruções.
Estrutura de exemplo:
A seguir está o conteúdo citado: <div id="menu"> <div class="menulista"> <div class="selectit"></div> </div> </div> |
Exemplo de CSS:
A seguir está o conteúdo citado: #menu {...} #menu.menulist {...} #menu .menulist .selectit { ... } |
No exemplo acima, a partir do efeito final, não há necessidade de #menu aparecer repetidamente, mas na verdade, se #menu puder ser adicionado na frente, tornará a hierarquia do documento mais clara e fácil de ler.
5. Sobre classificação de estilo
Ao projetar folhas de estilo CSS, geralmente escrevemos o código à mão, o que pode facilmente causar confusão na ordem dos estilos nas classes. Por exemplo, diversas classes utilizam preenchimento, margem, plano de fundo, cor e outros estilos. Porém, na ordenação, algumas classes possuem fundo mais alto e outras possuem margem mais alta. Isso cria uma certa confusão e pode facilmente frustrar seu pensamento. Sugiro que os designers individuais ou de equipe cheguem a um acordo sobre um pedido aproximado, de modo que individualmente não haja muita diferença, mas no geral seja mais fácil de ler e gerenciar, e a eficiência geral melhore muito.
Por exemplo, por padrão, coloco largura, altura, preenchimento, margem, borda, etc. na frente, seguido de plano de fundo, depois fonte, cor, alinhamento de texto, etc. apenas elementos, como estilo de lista, etc. e, finalmente, filtros CSS. Ao encontrar situações especiais (como a prioridade de certas propriedades CSS que precisam ser definidas), isso pode ser tratado de forma flexível.