CSS3中使用fit-content實現水平置中方法介紹

來源:互聯網
上載者:User
今天通過本文給大家介紹一個fit-content屬性的相關知識,CSS屬性是用來水平置中的,fit-content是CSS3中給width屬性新加的一個屬性值,它配合margin可以讓我們輕鬆的實現水平置中的效果;一起來看下代碼吧

當我們讓一個模組水平置中首先想到的肯定是margin:0 auto;有木有?那麼今天給大家介紹一個fit-content屬性,不知道有沒有同學用過,如果用過那麼你可以略過這篇文章,沒用過的同學就繼續了,我也是第一次看到這個屬性,之前不知道這個屬性更不用說使用了,原來這個CSS屬性是用來水平置中的,fit-content是CSS3中給width屬性新加的一個屬性值,它配合margin可以讓我們輕鬆的實現水平置中的效果;一起來看下代碼吧。

在不設定寬度,並且元素中含用float:left情況下置中,先看一段代碼:

如此這個導航是不會置中的,當我們通過設定fit-content加上margin來做到置中。

目前這個屬性只支援Chrome和Firefox瀏覽器,下面是置中的代碼:

相關文章

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.