国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

布局那點事

Worktile / 2782人閱讀

摘要：兩列左側(cè)固定寬度，右側(cè)自適應(yīng)三列左右固定，中間自適應(yīng)流式

1.兩列左側(cè)固定寬度，右側(cè)自適應(yīng) 

     

        
left

     

     

        
right

1.float+margin

  
.left {
   float:left;
   width:100px;
   height:100%;
}
.right {
   height:100%;
   margin-left:100px;
}

2.float+overflow

.left {
   float:left;
   width:100px;
   background:red;
}
.right {
   overflow:hidden;
   background:yellow;
}

3.flex

.parent{
   display: flex;       
}
.left{
   background: red;
   width: 100px;
}
.right{
   background: yellow;
   flex-grow: 1;
}
2.三列左右固定，中間自適應(yīng)

1.流式

.left{
   float:left;
   background:red;
   width:100px;
   height:100px;
   } 
.right{
   float:right;
   background:black;
   width:100px;
   height:100px;
   }
.center{
   background: yellow;
   margin-left:100px;
   margin-right: 100px;
   height:100px;
   }

2.BFC

.center{
background: yellow;
height:100px;
overflow: hidden;
}

3.Flex

.container{
   width: 100%;
   height:100px;
   display: flex;
}
.left{
 background:red;
 width:100px;
}
.right{
  background:black;
  width:100px;
  order:2;
}
.center{
  background:yellow;
  flex-grow:1;
  order:1;
}

4.absolute

.container{
  width: 100%;
  position: relative;
}
.left{
   background:red;
   width:100px;
   height:100px;
   position:absolute;
   left:0;
   top:0;
}
.right{
    background:black;
    width:100px;
    height:100px;
    position:absolute;
    right:0;
    top:0;
}
.center{
    background:yellow;
    margin:0 100px;
    height:100px;
}

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

轉(zhuǎn)載請注明本文地址：http://specialneedsforspecialkids.com/yun/114251.html

相關(guān)文章

  • 移動端鍵盤和光標(biāo)的兼容那點事

    摘要：解決方法如果使用頁面數(shù)據(jù)不超過一屏禁止?jié)L動，那么即使變成了頁面也不會有什么變化。 作者：@micky思 @wupq @yewq 在H5的開發(fā)中，個人的制作頁面布局習(xí)性不同，多多少少會產(chǎn)生在真機(jī)上input的光標(biāo)和鍵盤的彈出會出現(xiàn)的各種BUG，文中整理了部分遇到的問題，歡迎新增 ios移動端輸入框上浮導(dǎo)致輸入位置偏移 問題原因：遮罩層定位為fixed，當(dāng)鍵盤彈起時，ios11以及以下...

    XboxYan 評論0 收藏0

  • 移動端鍵盤和光標(biāo)的兼容那點事

    摘要：解決方法如果使用頁面數(shù)據(jù)不超過一屏禁止?jié)L動，那么即使變成了頁面也不會有什么變化。 作者：@micky思 @wupq @yewq 在H5的開發(fā)中，個人的制作頁面布局習(xí)性不同，多多少少會產(chǎn)生在真機(jī)上input的光標(biāo)和鍵盤的彈出會出現(xiàn)的各種BUG，文中整理了部分遇到的問題，歡迎新增 ios移動端輸入框上浮導(dǎo)致輸入位置偏移 問題原因：遮罩層定位為fixed，當(dāng)鍵盤彈起時，ios11以及以下...

    Kerr1Gan 評論0 收藏0

  • 移動端鍵盤和光標(biāo)的兼容那點事

    摘要：解決方法如果使用頁面數(shù)據(jù)不超過一屏禁止?jié)L動，那么即使變成了頁面也不會有什么變化。 作者：@micky思 @wupq @yewq 在H5的開發(fā)中，個人的制作頁面布局習(xí)性不同，多多少少會產(chǎn)生在真機(jī)上input的光標(biāo)和鍵盤的彈出會出現(xiàn)的各種BUG，文中整理了部分遇到的問題，歡迎新增 ios移動端輸入框上浮導(dǎo)致輸入位置偏移 問題原因：遮罩層定位為fixed，當(dāng)鍵盤彈起時，ios11以及以下...

    Jackwoo 評論0 收藏0

  • 【第1期】聊聊css居中那點事

    摘要：前言居中是網(wǎng)頁布局中再常見不過的一種方式了，今天我們就來聊聊居中的那點事。我是水平居中的同樣是針對塊級元素才有效果。來看代碼我是水平居中的必須配合來使用來可以實現(xiàn)居中的效果。方法二我是垂直居中的注意此方法要考慮的兼容性問題。 前言：居中是網(wǎng)頁布局中再常見不過的一種方式了，今天我們就來聊聊css居中的那點事。 我們主要從這幾個方面來了解下居中： 水平居中 垂直居中 水平垂直居中 水平...

    劉永祥 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<