成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

css-flex常見(jiàn)面試題

ZweiZhao / 3046人閱讀

摘要：廢話不多說(shuō)內(nèi)容寬度等分左右布局，一側(cè)定寬，一側(cè)自適應(yīng)撐滿固定寬度自適應(yīng)寬度未知高寬上下左右居中未知高度上下左右居中這個(gè)效果就不展示了，可以做到未知寬高，和已知寬未知高的居中效果。

廢話不多說(shuō)！

flex-內(nèi)容寬度等分 
//css
       .box {
            display: flex;
        }
        
        .box div {
            flex: 1;
            border: 1px solid red;
        }
//html
    

        
1

        
2

        
3

左右布局，一側(cè)定寬，一側(cè)自適應(yīng)撐滿 
//css
        html,
        body {
            height: 100%
        }
        
        .main {
            display: flex;
            height: 100%;
        }
        
        .left,
        .right {
            height: 100%;
            border: 1px solid red;
            box-sizing: border-box;
        }
        
        .left {
            width: 300px;
        }
        
        .right {
            width: 100%;
        }

//html
    

        
固定寬度300px

        
自適應(yīng)寬度

未知高寬上下左右居中 
//css
        html,
        body {
            height: 100%
        }
        
        .main {
            display: flex;
            height: 100%;
            justify-content: center;
            align-items: center
        }
        
        .box {
            width: 300px;
            border: 1px solid red;
        }
    
    //html
     

        
未知高度上下左右居中

這個(gè)效果就不展示了，可以做到未知寬高，和已知寬未知高的居中效果。

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/117343.html

相關(guān)文章

  • css-flex常見(jiàn)面試題

    摘要：廢話不多說(shuō)內(nèi)容寬度等分左右布局，一側(cè)定寬，一側(cè)自適應(yīng)撐滿固定寬度自適應(yīng)寬度未知高寬上下左右居中未知高度上下左右居中這個(gè)效果就不展示了，可以做到未知寬高，和已知寬未知高的居中效果。 廢話不多說(shuō)！ flex-內(nèi)容寬度等分 //css .box { display: flex; } .box div { ...

    Godtoy 評(píng)論0 收藏0

  • 常見(jiàn)面試題—css實(shí)現(xiàn)垂直水平居中

    摘要：常見(jiàn)面試題實(shí)現(xiàn)垂直水平居中前言面試中常常被問(wèn)到，如何使用來(lái)實(shí)現(xiàn)一個(gè)元素的垂直水平方向上居中，特別是筆試題的時(shí)候，這道題目的出現(xiàn)頻率還是比較高的，當(dāng)然，在我們的生活中，也常常會(huì)有垂直水平居中的需求。 常見(jiàn)面試題—css實(shí)現(xiàn)垂直水平居中 前言 面試中常常被問(wèn)到，如何使用css來(lái)實(shí)現(xiàn)一個(gè)元素的垂直水平方向上居中，特別是筆試題的時(shí)候，這道題目的出現(xiàn)頻率還是比較高的，當(dāng)然，在我們的生活中，也常常...

    gougoujiang 評(píng)論0 收藏0

  • 前端常見(jiàn)面試題總結(jié)

    摘要：個(gè)人總結(jié)的一些常見(jiàn)面試題歡迎各位同時(shí)非常歡迎貢獻(xiàn)問(wèn)題一起來(lái)完善不定期更新常見(jiàn)前端面試題總結(jié) 個(gè)人總結(jié)的一些常見(jiàn)面試題,歡迎各位star,issues,同時(shí)非常歡迎貢獻(xiàn)問(wèn)題!一起來(lái)完善.不定期更新常見(jiàn)前端面試題總結(jié)

    ingood 評(píng)論0 收藏0

  • 前端常見(jiàn)面試題（實(shí)戰(zhàn)遇到）

    摘要：瀏覽器內(nèi)核常用的塊元素和內(nèi)聯(lián)元素?cái)?shù)據(jù)類型語(yǔ)句前端優(yōu)化方法會(huì)話跟蹤方法和區(qū)別循環(huán)輸出網(wǎng)站優(yōu)化清除浮動(dòng)方法，優(yōu)缺點(diǎn)和區(qū)別截取長(zhǎng)文本寫方法截取字符串響應(yīng)式布局瀏覽器兼容正則表達(dá)式驗(yàn)證身份證源碼自己如何封裝一個(gè)固定一個(gè)按鈕在右下角畫一個(gè)三角形同步和 1、瀏覽器內(nèi)核2、常用的塊元素和內(nèi)聯(lián)元素3、數(shù)據(jù)類型 *4、SQL語(yǔ)句5、前端優(yōu)化方法 *6、會(huì)話跟蹤方法 *7、display ： none 和...

    時(shí)飛 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<