1、 新的html頁面，在head部分載入該載入的css，如normalize.css，要用的swiper.css、layui.css等，按照固定的pc端和移動端規 範來設定html相關屬性。；
在移動端編寫頁面時，使用layui自帶的類的樣式（如文字框，label，核取方塊等）時，請用來寫，不要在外面用css引入，以免規定長寬的時候會自適應，導致不同手機顯示頁面效果不同。
2、類名的設定，不要隨意，最好是標籤加下劃線加單詞的形式，在less中編寫，能巢狀盡量巢狀形式，減少維護修改時間成本；
乙個頁面區域分塊要清晰，上中下，什麼標籤、p、div歸為上中下哪個部分，乙個頁面根據功能，分為title，表單，跳轉部分，比如下圖移動端頁面，title與跳轉部分內容都是居中的，「提交」按鈕和核取方塊放在乙個div，textaligncenter就成了。
然後就是span、a、img這些用的比較多的，一定要巢狀寫好（不建議起一堆名字。。），省的產生衝突或者因為css優先順序而出錯。
3、最後補充，引入css順序，先normalize.css，最基本的，其次是用到的外掛程式如jquery.css、swiper.css、layui.css、bootstray等，最後是自己寫的css。必須按照此順序，否則起衝突弄半天自己也不知道為啥。
附上移動端頁面。
H5 CSS樣式 小結
推薦查詢相關 div 我是divdiv css樣式的繼承 body 如果不給標籤新增額外的字型顏色 頁面所有的文字顏色都會設定為藍色 屬性 描述width 設定長度 單位px height 設定高度 單位px float float left right none 讓元素浮動起來 用於布局 posi...
前端vue規範自用
1.元件名name 倆個單詞開頭大寫 2.元件檔名 命名my component.vue 3 基礎元件，很多地方需要用到 base button.vue base icon.vue 4 和父元件緊密耦合的子元件應該以父元件名作為字首命名 todo list.vue todo list item bu...
「前」方有坑，繞道而行（一） H5 CSS
1.關於 數字 英文 不換行問題 情景 昨天測試 小程式，輸入英文，沒有換行，且 下方有橫向滾動條 解決 word break word break break all 只對英文起作用，以字母作為換行依據 word wrap break word 只對英文起作用，以單詞作為換行依據 white sp...