Faz muito tempo que não atualizo meu blog. Muitas coisas aconteceram nesse período e estou exausto. Mas ainda há muitas coisas que quero fazer, como atualizar o merceCSS, organizar o conteúdo modular que resumi até agora e compartilhá-lo com todos, participar de reuniões de intercâmbio, etc.
Mencionei muito o design modular, como " Modularidade do design de móveis da IKEA ", " Pensamento modular na reconstrução de páginas ", " Pontos-chave da produção de componentes na reconstrução de páginas " estão todos relacionados à modularidade, mas nunca falei sobre o específico conteúdo de implementação antes, apenas algumas reflexões. Desta vez vou me concentrar no aspecto da implementação e resumir um pouco da modularização que fiz até agora.
Para fazer um bom trabalho na modularização , acho muito importante entender o alcance dos estilos, por isso esta parte é o primeiro artigo desta série.
Todos os alunos que escreveram programas devem saber que variáveis têm escopo (se você não sabe, pergunte você mesmo ao Google, não vou explicar aqui também há problemas de escopo, ou seja, o escopo da definição). . É fácil de entender, como o escopo de p abaixo:
/*作用域：全局*/ p{text-indent:2em;}
/*作用域：.demo这个类中*/ .demo p{color:#000000;}
A prioridade dos seletores de estilo é o conhecimento básico dos estilos de aprendizagem. Vamos revisá-lo brevemente:
As regras utilizadas também são muito simples, ou seja, os pesos dos seletores são somados, e o maior tem precedência, se os pesos forem iguais, o definido posteriormente tem precedência ; Embora seja muito simples, se você não prestar atenção ao escrever, pode facilmente levar a definições repetidas de CSS e código redundante.
Do exposto, podemos extrair dois fatores principais:
Qual a utilidade de saber o peso do estilo? Por exemplo, pode ser usado assim: Para dar o exemplo mais simples,
body{color:#555555;}.demo{color:#000000;}
<p>这里的文字颜色受全局定义的影响</p>
<div class="demo"><p>这里的文字颜色受类demo定义的影响</p></div>
<p class="demo">这里的文字颜色受类demo定义的影响</p>
Conhecendo o peso do estilo, você saberá o desempenho do exemplo acima. Outra aplicação é a modularização, como nos exemplos em " Modularização da IKEA Furniture Design ", consulte mais detalhes.