在編寫css樣式時,名稱書寫的順序是非常重要的。這個順序依次是:
selector { /* Positioning */ position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 100; /* Box-model */ display: block; float: right; width: 100px; height: 100px; /* Typography */ font: normal 13px "Helvetica Neue", sans-serif; line-height: 1.5; color: #333; text-align: center; /* Visual */ background-color: #f5f5f5; border: 1px solid #ccc; border-radius: 4px; opacity: 1; }
首先,應該先設置元素的定位屬性、位置、z-index值,并將它們放在最上面。
接下來,應該設置元素的盒模型屬性(display、float、width、height等),這部分樣式通常占用了大部分的代碼。
緊隨其后的是設置元素的排版屬性,如文字字體、大小、顏色等。
最后是元素的可視化屬性,如背景顏色、邊框等。
按照這樣的順序編寫css樣式,不僅可以使代碼更加清晰易懂,而且也能夠提高開發效率。
下一篇dockerfegin