方法① ：行內元素 （父元素）text-align，（子元素）inline-block
.parent.child
總結：優點：相容性好，支援低版本瀏覽器
缺點：需要同時在父元素和子元素上設定
適用場景：子元素數量少（或只有乙個），並且需要相容低版本瀏覽器時使用，不受float影響
方法②：塊狀元素 使用margin:0 auto來實現
.child
優點：相容性好
缺點：需要指定寬度
前提：用於子元素上，不受float影響
方法③：（子元素）display:table;margin:0 auto;
.child
優點：只需要對自身進行設定
缺點：不相容ie6和ie7
適用場景：子元素數量多，不方便修改父元素的屬性，對瀏覽器版本要求相對較低時使用
方法④：絕對定位實現 （父元素）position:relative，（子元素）absolute+left+transform（translatex(-50%)）
.parent/*或者實用margin-left的負值為盒子寬度的一半也可以實現，不過這樣就必須知道盒子的寬度，但相容性好
*/.child
優點：不影響其他元素
缺點：transform相容性，ie9及以上可用
方法⑤：flex+justify-content/margin
/*第一種方法
*/.parent
/*第二種方法
*/.parent.child
第一種方法：
優點：只設parent
缺點：flex相容性差，而且比較耗資源
第二種方法：
優點：**簡單
缺點：汙染父元素，flex相容性問題，如果進行大面積的布局可能會影響效率
方法① ：單行文字 設定line-height等於父元素高度
.child
優點：**簡單
缺點：只適合一行文字，多行文字則不可以
這是一種很流行的方法, 也適應ie7.
方法② ：行內塊級元素 使用display:inline-block; vertical-align:middle;
.child.parent:after
方法③：塊級元素 使用vertical-align的時候，由於對齊的基線是用行高的基線作為標記，故需要設定line-height或設定display:table-cell;
/*第一種方法
*/.parent
/*第二種方法
*/.parent
優點：相容性比較好，換成table可以相容ie6,7
缺點：table-cell不能和float、position:absolute同時設定。（只能在外parent外套一層div.wrap才能設定float）
若元素的高度不一定的話
vertical-align只有在父層為 td 或者 th 時, 才會生效, 對於其他塊級元素, 例如 div、p 等, 預設情況是不支援的. 為了使用vertical-align, 我們需要設定父元素display:table, 子元素display:table-cell;vertical-align:middle;
/*第一種方法
*/.parent.child
優點：元素高度可以動態改變，不需要css定義，如果父元素有足夠空間，該元素不會被截斷
缺點：ie6、7，甚至ie8 beta中無效
方法④：使用絕對定位
.parent.child
優點：基本只設定子元素，不影響其他元素
缺點：transform相容性問題
方法⑤：使用flex實現方法 （父）flex + align-items
.parent
優點：只要設定parent
缺點：flex和align-items的相容性
.parent.child
.parent.child
.parent.child
方法④：使用絕對定位
.parent.child
優點：基本只設定子元素，不影響其他元素
缺點：transform相容性問題
方法⑤：利用flex實現
.parent
優點：只要設定parent
缺點：flex和align-items的相容性
移動前端開發和 Web 前端開發的區別
普通pc端開發與移動端開發區別。普通pc端開發，我理解就是你拿電腦開啟的網頁都算。那麼移動端前端開發工程師，說白了就很好理解了，做手機網頁的前端開發工程師。這麼一比，是不是感覺，移動端開發簡單多了？pc，我們需要考慮什麼呢？有點開發經驗的同學都知道，ie6 11，firefox，chrome，saf...
WEB前端開發中的SEO注意點
近幾年來，seo在國內得到了蓬勃的發展，其中很多的seo技術越來越體現在web前端的一些細節上。要做好seo，web前端這一塊也要做必不可少的優化。這就要求我們web前端工程師在開發頁面的時候，要寫出規範標準的 符合seo，做好使用者體驗。1 布局要做到樣式與頁面分離，刪除頁面中不必要的標籤和元素。...
學前端的第5天
中間空了幾天沒有繼續練習，三天打魚兩天曬網的習慣不好，今天全天空著，要多花一些時間趕一下。不要想著其他後路，現在找工作都是未知數，如果總是安慰自己我也不一定需要這個技能找工作，就會一直拖延，最後時間過了也沒有什麼結果，最後就真的沒有工作了。剛入門的感覺就是，明明 都是一行行抄的，就是執行錯的，然後也...