真实的国产乱ⅩXXX66竹夫人,五月香六月婷婷激情综合,亚洲日本VA一区二区三区,亚洲精品一区二区三区麻豆

重慶分公司 重慶分公司

• 網(wǎng)站建設(shè)
• 網(wǎng)站制作
• 網(wǎng)站營銷
• 小程序
• 新聞動態(tài)
• 成功案例
• 關(guān)于我們
028-86922220

• 網(wǎng)站建設(shè)
• 網(wǎng)站制作
• 網(wǎng)站營銷
• 小程序
• 新聞動態(tài)
• 成功案例
• 關(guān)于我們

  DEMO

  DEMO

• 塊狀元素的水平居中（不定定寬）

在實際工作中我們會遇到需要為“不定寬度的塊級元素”設(shè)置居中，比如網(wǎng)頁上的分頁導(dǎo)航，因為分頁的數(shù)量是不確定的，所以我們不能通過設(shè)置寬度來限制它的彈性。

可以直接給不定寬的塊級元素設(shè)置text-align：center來實現(xiàn)，也可以給父元素加text-align:center 來實現(xiàn)居中效果。

當(dāng)不定寬塊級元素的寬度不要占一行時，可以設(shè)置display 為 inline 類型或inline-block（設(shè)置為 行內(nèi)元素 顯示或行內(nèi)塊元素）

    

        
1
        
2
        
3
    

二、垂直居中

和水平居中一樣，這里要講垂直居中，首先設(shè)定兩個條件即父元素是盒子容器且高度已經(jīng)設(shè)定

子元素是行內(nèi)元素，高度是由其內(nèi)容撐開的

這種情況下，需要通過設(shè)定父元素的line-height為其高度來使得子元素垂直居中

    111111

三、水平垂直居中

在css標(biāo)簽內(nèi)，將display屬性設(shè)置為flex，實現(xiàn)flex布局，再將align-items屬性設(shè)置為center(水平方向居中)，justify-content屬性設(shè)置為center（垂直方向居中）。即可設(shè)置為水平垂直居中。

    
    
    
    


    
        測試


.mydiv{
    width:200px;
    height:100px;
    border:1px solid black;
    display:flex;
    align-items:center;
    justify-content:center;
}

“css中有哪些對齊方式”的內(nèi)容就介紹到這里了，感謝大家的閱讀。如果想了解更多行業(yè)相關(guān)的知識可以關(guān)注創(chuàng)新互聯(lián)網(wǎng)站，小編將為大家輸出更多高質(zhì)量的實用文章！