一、css次序第一声明，阅读器读取css的方式是从上到下的。我们个别书写css只有元素具备这些属性就会达到我们预测的结果，但是这会给今后的保护和阅读器的渲染效率带来一定的影响，那么该怎么书写css的次序呢？有没有一定的标准呢？第一我们晓得css的属性按特性分为几类；1.规定元素特性，如display、position、float，这些属性会决议他的排版方式2.规定元素的空间

一、css次序

　　第一声明，阅读器读取css的方式是从上到下的。我们个别书写css只有元素具备这些属性就会达到我们预测的结果，但是这会给今后的保护和阅读器的渲染效率带来一定的影响，那么该怎么书写css的次序呢？有没有一定的标准呢？

　　第一我们晓得css的属性按特性分为几类；

　　1.规定元素特性，如display、position、float，这些属性会决议他的排版方式

　　2.规定元素的空间占领，如line-height、margin、padding、width、height等，这些属性会决议元素的大小和位置

　　3.规定元素的本身结果，如font-size、color、background等，这些属性会决议元素的结果

　　其实当我们把css的属性分类完毕后，我们会得到一个很显明的答案，我们可以想象一下本人用css按照本人的书写次序画出来该元素，举例注明

p.detail {
  font-size: 10px;
  line-height: 12px;
  width: 30px;
  height: 30px;
  display: inline;        
}

　　描述：这是一个元素 字体大小10px 行高12px 宽度30px 高度30px 陈列方式为内联样式

　　当我们开端读取属性的时候，我们会很难对元素进行定位，由于我们不晓得元素的特性，陈列方式。读到最后一行的时候才发明，本来这是一个内联元素，宽度和高度的定义就会失效，所以这种css书写次序是不被举荐的

p.detail {
  display: inline-block;
  margin-top: 20px;
  width: 100%;
  height: 20px;
  color: #fff;
  font-size: 10px;
}

　　描述： 这是一个元素，陈列方式为内联-块方式，距上有20px 宽度与父元素等宽 高度为20px 色彩为白色 字体大小为10px

　　这样的书写方式就能按照一个我们很容易了解的方式进行渲染

　　总结： 我们书写css的时候举荐的标准是，先书写影响元素陈列特性的属性，再书写影响元素位置的属性，最后书写元素的内下属性

二、点击或hover等触发高亮状况的css书写

　　当鼠标hover的时候，我们往往给需要转变的元素增加一个active类名，然后在active里面书写我们需要转变的属性

　　如：

.content {
  background: black;  
}
.active {
  background: white;
}

　　当我们点击某元素的时候，需要.content的配景色从玄色酿成白色，那么给.content增加active类名就会达到我们的预测结果，然而我们有的时候点击的时候不止要转变一个元素的属性，我们有可能会有这种状况

　　我们需要在点击一个类名为.click的元素的时候，元素icon字体 和 span元素一个字体变大 一个变为红色怎么办，我们可以这样

	
	




    
    



    

    
打赏
    

    

    	
        
    	

    		
感谢您的支持，我会继续努力的!
    	
    	

    		
    	
    		
扫码打赏，你说多少就多少
    	

    		

	    		
	    		
    		
    		

	    		
	    		
    		
    	
    	

    		
打开支付宝扫一扫，即可进行扫码打赏哦
    		
百分百源码网 建议打赏1～10元，土豪随意，感谢您的阅读！