移動端頁面總結

一段時間沒有寫過頁面了，最近寫了兩個，寫後發現與老同事寫的仍是有點差距的，話說寫頁面不難，可是你要去寫好，真不是一朝一夕的練就的。因此多練習，多總結。

咱們對於移動端沒有太多的要求，就是相對簡單的頁面，只要佈局合理，維護容易就能夠，可是就這個作起來仍是不是那麼簡單的。

對比一下，總結以下

第一，咱們的容器div都是設置100%，box-size:border-box;我設置了最大寬度640px和最小寬度320px；相對定位。

第二，二級容器div對方用的padding定位左右，我用的是百分比，而後加上自動居中，在此係列的div容器通常都定義好公用樣式，好比背景色，上下邊距等，作法的不一樣會致使背景色的顯示範圍不一樣，這點須要根據視覺稿

第三，對方都是把img標籤放在單獨一個div容器中，我這邊單獨使用的img標籤，本身百度了下，最好仍是放在div容器中，設置其樣式方便

第四，對方標題通常使用h標籤，我通常使用的是p標籤，那麼標題的話儘可能使用h標籤爲好

第五，對於文字環繞塊級元素，這邊的塊級元素是內聯塊級元素img，對方則使用了span標籤嵌套，span浮動後自動轉換爲塊級元素，一樣也可以使用div嵌套

第六，p標籤的元素空格，我是用的 ，使用這個的缺點就是不一樣瀏覽器的對其兼容不一樣，那麼對方用的是text-indent屬性，對其設置縮進值。