高度自適應佈局

来源:http://www.cnblogs.com/spiderfamily/archive/2016/01/19/5143374.html
-Advertisement-
Play Games

在網頁佈局中,經常用到高度自適應增長的佈局。如左側是文章內容部分,隨著文章內容的變化,高度也不固定,右側則是一些固定高度的相關內容。如圖所示: 簡單摸索後發現CSS中有一個min-height的屬性,如果設置min-height為200px,當高度大於200px時,則自動開始增長;小於20...


    在網頁佈局中,經常用到高度自適應增長的佈局。如左側是文章內容部分,隨著文章內容的變化,高度也不固定,右側則是一些固定高度的相關內容。如圖所示:

  簡單摸索後發現CSS中有一個min-height的屬性,如果設置min-height為200px,當高度大於200px時,則自動開始增長;小於200px則為200px。結合float:left,我的佈局如下:

  

<div id="main"> <div id="left">原標題:花榮:春節前一定不要賣 第一反彈目標位是3360   搜狐證券訊 同一位置第二根長陽,滬指再次站上3000點,經過幾日反覆之後,這次能開啟超跌後的反彈行情嗎?帶著投資者最為關心的問題,搜狐財經電話連線了知名操盤手花榮先生,希望他在這個關鍵時刻能夠用他幾十年的市場經驗來幫助投資者認識目前市場所處的位置。

  雙底構築成功 春節前以上漲為主

  問題1:這根長陽意味著築底成功了嗎?

  花榮:1月份這輪調整已經完全超跌,這根長陽意味著築底成功,2844.70點很可能成為階段低點,與2850點構成雙底,上半年總體看好,春節前以上漲為主。

  反彈目標先看到3360 其實4200點的可能性更大

  問題2:這輪反彈目標位在哪裡?

  花榮:本輪反彈目標第一階段,先看到30日均線3360點,為什麼看到30日均線?第一次股災之後的反彈就是受制於此條均線,所以這個位置很重要,無論是空間關口還是心理關口。第二階段,如果站上3360之後,那麼下一步的反彈目標就是4200點。目前來看,能夠到達第二階段的可能性更大。

  1月下砸是為了騰出空間 機構要用單邊上漲迎接註冊制

  問題3:1月為什麼砸得這麼厲害

  花榮:目前來看,1月份這輪深度調整更像是機構故意為之,只有下砸才能為即將而來的單邊上漲行情騰出空間,也只有接下來的單邊上漲更符合機構的利益,為註冊製造勢,須知道,這種態勢和2015年新股發行之前的狀況幾乎如出一轍。

  時間和空間都已經到位 急跌之後必是V形底

  問題4:這個位置築底時間是不是太短?

  花榮:陰跌之後一般是圓弧底,需要時間消化,但1月這波調整是急跌、暴跌,這種情形的築底一定是V字形,所以說,目前調整的時間和空間都已經足夠。

  春節前一定不要賣 一帶一路是短線龍頭

  問題5:深套的投資者如何操作?

  花榮:春節前一定不要賣,可以選擇換股。今天的行情是一帶一路概念全面帶動的,所以說短線行情以中字頭主板、一帶一路為主。 </div> <div id="right">dsfdsafsd</div> <div id="footer">底部內容</div> </div>

  紅色部分是測試文字部分。

  具體樣式如下:

  #main{

    margin:0 auto;

    width:1000px;

    min-height:300px;

  }
  #left{

    width:600px;
    min-height:300px;
    float:left;
    background-color:#cc00cc;
  }
  #right{

    width:400px;

    height:300px;

    float:left;

    background-color:#cccc00;

  }
  #footer
  {

    float:left;

    margin:0 auto;

    width:1000px;

    height:60px;

    background-color:#cccccc; background-image:url('20120227095908_5zK2V_thumb_600_0.jpg');//背景圖片

  }

  經過簡單的測試後發現,各類瀏覽器完全適用,OK,搞定!


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 如果JS代碼中設置元素的另一個CSS屬性font-family。這個屬性的獲取方式與color屬性略有不同,因為 font和family之間的連字元與JS中減法操作符相同,JS會把它解釋為減號。如果你像下邊這樣訪問名為 font-family 的屬性,會收到一條出錯信息:Element.style....
  • 寫了這麼久的CSS,但大部分前端er都沒有按照良好的CSS書寫規範來寫CSS代碼,這樣會影響代碼的閱讀體驗,這裡總結一個CSS書寫規範、CSS書寫順序供大家參考,這些是參考了國外一些文章以及我的個人經驗總結出來,我想對寫CSS的前端用戶來說是值得學習的。 CSS書寫順序 1.位置屬性(positi....
  • 在這時碰到了一個圓角邊框的問題,以前的代碼是在每個頁面寫一個固定結構的div,使用背景圖片來實現圓角邊框。代碼結構大致如下:.top_border{background:url(topborder.png);}.left_border{background:url(leftborder.png);}...
  • 好吧,因為很重要的事情,幾天沒寫筆記了。關於對象:||可以用來填充預設值,如:myApp.name || "無"&&可以用來避免錯誤,myApp.NameObj有某種情況不存在,那麼可以用myApp.NameObj &&myApp.NameObj.Name避免腳本錯誤所有通過對象字面量創建的對象都連...
  • 我們知道,MongoDB屬於文檔型資料庫,其存儲的文檔類型都是JSON對象。正是由於這一特性,我們在Node.js中會經常使用MongoDB進行數據的存取。但由於Node.js是非同步執行的,這就導致我們無法保證每一次的資料庫save操作都是原子型的。也就是說,如果客戶端連續兩次發起同一事件將數據.....
  • 前些天在寫一個項目的時候,使用cookie來存儲一些用戶數據,在用戶登出時需要清理以往的數據,對於一個初學者來說,我需要學習如何清除一個已知的cookie。首先,引入兩個js文件: 1.jquery-1.12.0.min.js這是編輯這篇文章時最新的jQuery; 2.carhartl-jque.....
  • javascript基本概念重要知識點總結。
  • 想通過JQuery來check或者uncheck頁面上的checkbox控制項,我們可能會想到用下麵的代碼:$('#chk-all').on('click', function(){ var checked = $(this).is(':checked'); $("input[type...
一周排行
    -Advertisement-
    Play Games
  • 移動開發(一):使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說,近來想嘗試開發一款安卓APP,考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP,畢竟是使用Visual Studio開發工具,使用起來也比較的順手,結合微軟官方的教程進行了安卓 ...
  • 前言 QuestPDF 是一個開源 .NET 庫,用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫,它徹底改變了我們生成 PDF 文檔的方 ...
  • 項目地址 項目後端地址: https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址: ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址: http://tree ...
  • 話不多說,直接開乾 一.下載 1.官方鏈接下載: https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe,運行開始下載SQL server; 二. ...
  • 前言 隨著物聯網(IoT)技術的迅猛發展,MQTT(消息隊列遙測傳輸)協議憑藉其輕量級和高效性,已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫,為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog支持多種接收器用於日誌存儲,增強器用於添加屬性,LogContext管理動態屬性,支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項,適用於不同需求。 ...
  • 目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據,爬取信息時需要模擬瀏覽器行為,否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下: 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • 1.前言 什麼是熱更新 游戲或者軟體更新時,無需重新下載客戶端進行安裝,而是在應用程式啟動的情況下,在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR,Xlua,ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles,Addressable, ...
  • 本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺,其實像阿裡雲,騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後,它會送 ...
  • 通過以下方式可以高效,並保證數據同步的可靠性 1.API設計 使用RESTful設計,確保API端點明確,並使用適當的HTTP方法(如POST用於創建,PUT用於更新)。 設計清晰的請求和響應模型,以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證,確保接收到的數據符合預期格 ...