yanhaijing/vertical-center

垂直水平居中：display: -webkit-box

Open

#6 建立於 2020年6月5日

在 GitHub 查看
 (4 留言) (0 反應) (1 負責人)HTML (444 star) (60 fork)batch import
help wanted

描述

拜读大佬文章，受益颇多。

这里补充一种实现垂直水平的方法：display: -webkit-box

父元素设置：

display: -webkit-box;
/** 水平居中**/
-webkit-box-pack: center;
/** 垂直居中**/
-webkit-box-align: center;

缺点也很明显，兼容性不太好。

参见:https://ataola.github.io/show/zj/center-middle.html

貢獻者指南

技術棧
css
領域
frontend
議題類型
documentation
難度面向新貢獻者的預計實作難度，1 表示很小改動，5 表示專家級工作。
1
預計時間有經驗貢獻者完成調查、實作、測試並準備 pull request 的粗略時間範圍。
under 1 hour
活動狀態議題目前的可參與程度：新鮮、活躍、陳舊、阻塞或等待維護者輸入。
stale
清晰度議題是否清楚說明預期改動、驗收標準和下一步。
clear
前置要求
無
新手友善度1-100 的估計分數，表示該議題對首次貢獻者的友善程度。
85
研究方向
该issue建议在垂直居中示例集合中添加`display: webkit box`方法。需要检查仓库中现有的文档结构（如README或HTML文件），找到示例列表部分，将新方法添加到适当位置。同时，由于该方法依赖旧语法且兼容性不佳，建议在说明中注明浏览器支持情况或推荐使用现代Flexbox方案。