css水平和垂直居中在開發中經常用到，在此加以總結。
水平居中方法
1.行內元素水平居中，設定父元素的text-align: center。
center
#box 常用的行內元素有a、abbr、b、br、em、input、label、select、span、strong、sub、sup、textarea等。
2.寬度固定的塊級元素水平居中，設定該元素的margin: 0 auto。
center
#box 常用的塊級元素有address、article、audio、blockquote、canvas、div、footer、form、h1、header、hr、ol、output、p、pre、section、table、ul、video等。
3.絕對定位元素水平居中，設定父元素position: relative，設定該元素left: 0; right: 0; margin: 0 auto;。
center
#box #content #content #content { position: absolute; height: 12em; top: 50%; margin-top: 6em;
5.flex布局，設定父元素display: flex; align-items: center
center
#box { display: flex;
align-items: center;
CSS 居中布局
居中在平時的運用很多，以下簡單做了一些總結。統一 html 格式如下 class container class content contentdiv div 居中效果如下 1.1.1 已知父元素子元素高度 container content 1.1.2 未知父元素高度，已知子元素寬度 高度.con...
CSS居中布局
方式一 css3 transform parent child 方式二 flex 布局 parent 適用於子元素為浮動，絕對定位，內聯元素，均可水平居中。常見的內聯元素有 span,a,img,input,label 等等 parent 此方法同樣適用於 display inline block ...
CSS居中布局
一 水平居中方案 1 行內元素 設定 text align center 2 定寬塊狀元素 設定 左右 margin 值為 auto 3 不定寬塊狀元素 a 在元素外加入 table 標籤 完整的，包括 table tbody tr td 該元素寫在 td 內，然後設定 margin 的值為 aut...