Adam Argyle
本程式碼研究室將協助您分享及展示自己最喜歡的 CSS 居中對齊方式。
請參閱我的網誌文章「CSS 中的置中」，瞭解我最喜歡的 5 種 CSS 置中方式。或者觀看這部影片！
設定
- 按一下「Remix to Edit」，即可編輯專案。
- 開啟「
app/index.html」 - 在
line 23中，將/* your centering CSS here /*替換為 CSS - (選用) 為居中技術命名，並取代
<h1>中的文字
樣式
- 在
app/css/資料夾中建立新檔案 - 建立選取器來保留居中解決方案，例如
.turbo-center或[floaty-mcfloat] - 在這個新的選取器中，編寫您的置中技巧 (您可以參考
app/css/中的其他例子) - (選用) 編寫一些「支援樣式」，以便我們瞭解哪些子項需要樣式來支援居中對齊
- 開啟
app/css/index.css，並在底部匯入新檔案
將所有內容整合
- 再次開啟
app/index.html - 找出
<article>，並為其指定您在上一個部分的步驟 2 中建立的自訂選取器。 - 在 Twitter 上發布你的 Glitch，我會在網誌文章中介紹它！