第十三日回顧:
在昨天,我們介紹了有關於網頁流向的相關資訊,其中比較有趣的就是 position:fixed 屬性了,他可以配合 a 標籤來實現回到頂部的功能,這邊補充一下, a 標籤除了可以連結外部網站以外也可以透過其他標籤的 id 來跳轉過去該標籤的位置,是不是很方便呢~馬上進入今天的主題,置中
置中的方法有非常多種,其中又分為水平置中以及垂直置中,以目前我使用到的有三種方法,當然,也許有更多種,這就要靠大家發現囉
1.text-align: 此屬性可以決定你在父元素的水平位置,特別強調是在父元素內,因此若使用上出現問題不妨先查看父元素的寬度是否有設定
2.相對定位 + margin: 首先呢,我們會透過絕對定位來將需要置中的內容左以及上設置到 50% 的位置,而後在透過 margin-top 和 margin-left 將位置偏移到自身長、寬的一半位置,這樣就可以在畫面中置中了
3.Flex 屬性:我們也可以透過更改元素屬性來進行排版,不過由於 Flex 的篇幅稍微大了些因此今天就不多以描述了
好啦,今天就先介紹如何將元素置中,至於其他內容就讓我們在更多的明天繼續擠出來吧
小抱怨專區:
中秋連假結束了,好沒有感覺啊...三天就這樣消失了