三列布局-中间固定俩边自适应-和两边固定中间自适应布局
生活随笔
收集整理的這篇文章主要介紹了
三列布局-中间固定俩边自适应-和两边固定中间自适应布局
小編覺得挺不錯的,現(xiàn)在分享給大家,幫大家做個參考.
中間固定倆邊自適應
1 <!doctype html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>無標題文檔</title> 6 </head> 7 <style> 8 *{margin:0;padding:0;} 9 .container{width:100%;height:100%;} 10 .container div{height:400px;text-align:center;font-size:20px;line-height:400px;} 11 .left{width:50%;margin:0px 0px 0px -400px;float:left;} 12 .left .innerbox{background:#ccc;margin:0px 0px 0px 400px;} 13 .right{width:50%;margin:0px 0px 0px -400px;float:left;} 14 .right .innerbox{background:#ccc;margin:0px 0px 0px 400px;} 15 .middle{width:800px;background:#000;float:left;color:#fff;} 16 </style> 17 <body> 18 <div class="container"> 19 <div class="left"> 20 <div class="innerbox">我是左邊的盒子</div> 21 </div> 22 <div class="middle">中間的盒子</div> 23 <div class="right"> 24 <div class="innerbox">我是右邊邊的盒子</div> 25 </div> 26 </div> 27 </body> 28 </html>兩邊固定中間自適應
1 <!doctype html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>無標題文檔</title> 6 </head> 7 <style> 8 *{margin:0;padding:0;} 9 body{width:100%;height:100%;overflow-x:hidden;background:#ccc;} 10 .container{width:100%;height:800px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;position:relative;} 11 .left{width:200px;float:left;height:100%;background:yellow;position:relative;z-index:2;} 12 .right{width:200px;float:right;height:100%;background:red;position:relative;z-index:2;} 13 .middle{position:absolute;left:200px;top:0px;padding:10px 200px 0px 10px;background:#000;z-index:1;color:#fff;height:790px; 14 </style> 15 <body> 16 <div class="container"> 17 <div class="left"> 18 我是左邊固定位寬為200px的盒子 19 </div> 20 <div class="middle"> 21 22 作為開源代碼庫以及版本控制系統(tǒng)，Github擁有140多萬開發(fā)者用戶。隨著越來越多的應用程序轉移到了云上，Github已經(jīng)成為了管理軟件開發(fā)以及發(fā)現(xiàn)已有代碼的首選方法[1] 。 23 如前所述，作為一個分布式的版本控制系統(tǒng)，在Git中并不存在主庫這樣的概念，每一份復制出的庫都可以獨立使用，任何兩個庫之間的不一致之處都可以進行合并。 24 GitHub可以托管各種git庫，并提供一個web界面，但與其它像 SourceForge或Google Code這樣的服務不同，GitHub的獨特賣點在于從另外一個項目進行分支的簡易性。為一個項目貢獻代碼非常簡單：首先點擊項目站點的“fork”的按鈕，然后將代碼檢出并將修改加入到剛才分出的代碼庫中，最后通過內(nèi)建的“pull request”機制向項目負責人申請代碼合并。已經(jīng)有人將GitHub稱為代碼玩家的MySpace。 25 在GitHub進行分支就像在Myspace（或Facebook…）進行交友一樣，在社會關系圖的節(jié)點中不斷的連線。 26 GitHub項目本身自然而然的也在GitHub上進行托管，只不過在一個私 27 28 有的，公共視圖不可見的庫中。開源項目可以免費托管，但私有庫則并不如此。Chris Wanstrath，GitHub的開發(fā)者之一，肯定了通過付費的私有庫來在財務上支持免費庫的托管這一計劃。 29 是的，我們正是這么計劃的。通過與客戶的接洽，開發(fā)FamSpam，甚至是開發(fā)GitHub本身，GitHub的私有庫已經(jīng)被證明了物有所值。任何希望節(jié)省時間并希望和團隊其它成員一樣遠離頁面頻繁轉換之苦的人士都會從GitHub中獲得他們真正想要的價值。 30 在GitHub，用戶可以十分輕易地找到海量的開源代碼。 31 2版本 32 編輯 33 34 2012年12月24日，GitLab 4.0 RC2 發(fā)布，開源的 Github克隆。 35 3內(nèi)幕信息 36 編輯 37 38 Chris Wanstrath還向記者分享了關于GitHub的一些內(nèi)幕信息︰ 39 GitHub主要用Rails實現(xiàn)。我們在進行的post-commit集成小應用完全使用Merb編寫。我們使用了Python的Pygments來做格式高亮顯示，另外，還用了Ara T. Howard's Bj加上一些Ruby腳本來做我們的排隊系統(tǒng)。當然，我們用了Ruby Grit庫來和Git進行交互。 40 GitHub已經(jīng)有了一組引人注目的特性，除了命令式的庫瀏覽器和一個項目Wiki，GitHub甚至還包括了一個GitHub gem，以使通過shell方式使用GitHub更為方便。更多的未來特性已經(jīng)在計劃中︰ 41 許多人都希望能有一個條目系統(tǒng)，因此一個簡單的條目系統(tǒng)已經(jīng)在開發(fā)中。此外，正如我前面所言，我們尚在進行RubyGems服務器和一些之前留出的post-commit鉤子方面的工作。如果你不能或就是不想托管一個你自己的守護進程，你可以使用我們所提供的。 42 我們還在開發(fā)一些特性來幫助公司在使用Github時可以停留在sync之上。 43 最後，我們也在進行API發(fā)布方面的工作。我們很快就會發(fā)布一些只讀性的API，隨後是一些很強大的“寫”集成。你可以使用API將新的事件發(fā)布到新聞feed中，發(fā)消息和做其他許多很酷的事情。 44 GitHub尚未設定官方版本的發(fā)布日期，不過估計在三月底（GitHub已經(jīng)上線，但只能通過邀請注冊）。更多關于GitHub的信息可以參見GitHub官方網(wǎng)站或GitHub博客。通過GitHub進行代碼管理的開源項目列表也已經(jīng)可以查閱。 45 </div> 46 <div class="right"> 47 我是右邊固定位寬為200px的盒子 48 </div> 49 </div> 50 </body> 51 </html>?
轉載于:https://www.cnblogs.com/ollie-sk8/p/4106007.html
總結
以上是生活随笔為你收集整理的三列布局-中间固定俩边自适应-和两边固定中间自适应布局的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： WPF应用程序内嵌网页
- 下一篇： Oulipo （KMP出现次数）