讓DIV顯示捲軸

來源:互聯網
上載者:User

       今天在公司接到一項任務,主要是做一個導覽功能表,菜單分橫縱結構,橫向主要顯示網站中所分大類,縱向主要顯示大類中的小類,而縱向菜單是用TreeView來實現的,當TreeView中有很多的項時,可能會使頁面走形,而公司要求是頁面大小要固定的情況下實現這些功能。這種結構在很多情況下都是通過架構來實現的,我想了想,架構畢竟是需要串連架構所包含的內容頁的,這可能會影響到網頁開啟的速度。如是我想能否去除一貫做法,提高我們的網頁載入速度呢?

      我想到了用DIV來實現,我想將TreeView控制項放置到DIV中,當項到達一定的高度時DIV中會自動出現捲軸,但DIV中是沒有這個屬性的,怎樣才能實現這一功能呢?如是我想到可以利用CSS樣式來控制DIV的樣式,這樣可能會實現。如是我在DIV中添加了如下樣式。經測試後成功了。

<div style="PADDING-RIGHT: 10px; 
             OVERFLOW-Y: auto; PADDING-LEFT: 10px;
             SCROLLBAR-FACE-COLOR: #ffffff; FONT-SIZE: 11pt; PADDING-BOTTOM: 0px; 
             SCROLLBAR-HIGHLIGHT-COLOR: #ffffff; OVERFLOW: auto; WIDTH: 200px; 
             SCROLLBAR-SHADOW-COLOR: #919192; COLOR: blue; 
             SCROLLBAR-3DLIGHT-COLOR:#ffffff; LINE-HEIGHT: 100%; 
             SCROLLBAR-ARROW-COLOR: #919192; PADDING-TOP: 0px; 
             SCROLLBAR-TRACK-COLOR: #ffffff; FONT-FAMILY: 宋體; 
             SCROLLBAR-DARKSHADOW-COLOR: #ffffff; LETTER-SPACING: 1pt; HEIGHT: 500px; TEXT-ALIGN: left; background-repeat: no-repeat;">
                <asp:ImageButton ID="imgbtnControl" runat="server" Height="25px" ImageUrl="~/Images_20.gif"
                    OnClick="imgbtnControl_Click" Width="90%" />
                <input id="Button2" type="button" value="button" runat="server" onserverclick="Button2_ServerClick" />
                <asp:TreeView ID="TreeView2" runat="server" Font-Size="9pt" ForeColor="Black" ShowLines="True">
                    <HoverNodeStyle Font-Size="9pt" ForeColor="Red" />
                </asp:TreeView>
            </div> 

高興!!!

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.