2. 程式人生 > >內嵌DIV帶滾動條效果

內嵌DIV帶滾動條效果

阿新 • • 發佈：2019-01-03

     通常我們會在網頁中加入一個div，並且讓它在內容比較多時出現滾動條. 其實這很簡單隻要給div的樣式style指定值就行即style="overflow:auto" 當然還得加上對div的長寬進行設定。即style="overflow:auto;width:600px;height:300px";如下例子：
       

 
    不過有個問題，如果div的大小改成百分比顯示時，在IE中將會出現一個bug，即這裡把width用百分比來顯示即這裡把style="height:300px; width:600px;overflow:auto;"改成style="height:300px; width:100%;overflow:auto;" 那麼，div的橫向滾動將不會出現，整個頁面也將被撐的變長。另外，這種改變在Firefox中顯示正常，滾動條還會回出.你可以去試試。            即要在ie中出現滾動條，必須指定具體值，而不是相對值。     有什麼辦法解決呢？即我希望是相對大小的方式指定div的大小，因為有時不同的瀏覽器的解析度不同大小就不一樣，如果用具體值寫死來的話，可能頁面樣式有不同的效果。    

  在網上找了很多資料，最後找到一個方法。如下：  給外層table(id為out)加個樣式style="table-layout:fixed;width:100%"       這裡需要注意的是body最好也指定的它的寬度為100%.      也許這個方法早就有前輩做過了，僅供大家參考。
     有啥疑問可以留言。

相關推薦

內嵌DIV帶滾動條效果

     通常我們會在網頁中加入一個div，並且讓它在內容比較多時出現滾動條. 其實這很簡單隻要給div的樣式style指定值就行即style="overflow:auto" 當然還得加上對div的長寬進行設定。即style="overflow:auto;width:600p

selenium之 如何控制網頁內嵌div中滾動條的滾動

很多人疑惑怎麼用selenium控制網頁div中滾動條的滾動，其實這個問題很簡單，用JS很簡單就可以實現。 示例HTML程式碼如下： <!DOCTYPE html> <

Selenium3+webdriver學習筆記12（js操作應用：滾動條 日曆 內嵌div）

#!/usr/bin/env python# -*- coding:utf-8 -*-'''Selenium3+webdriver學習筆記12（js操作應用：滾動條 日曆 內嵌div）'''from selenium import webdriverimport time,os# about:addons 火

純css，div隱藏滾動條，保留滑鼠滾動效果

當我們的內容超出了我們的div，往往會出現滾動條，影響美觀。 尤其是當我們在做一些導航選單的時候。滾動條一出現就破壞了UI效果。 我們不希望出現滾動條，也不希望超出去的內容被放逐，就要保留滑鼠滾動的效果。 這裡介紹一個簡單的方法。 大體思路是在div外面

div隱藏滾動條仍保留滾動效果，相容IE，FF，Webkit 和 O

只能說，既然需求有，那就得硬著頭皮做！光這個相容滾動條就花了我一早上+下午倆小時的時間！ 需求： 一個可以滾動內容的div，超出高度隱藏內容，但是要保留滾動效果又不出現滾動條，同時相容各種瀏覽器。 思路： 假設這個div叫做scroll_con

div滾動條效果及滾動條美化

2.一直很想看得<strong>杜妻瘋的《黑社會》</strong>終於出來了，經過<strong>廣電總局的妙手</strong>，現在成了<strong>《龍城歲月》，</strong>根本失去了原有的味道，還剪去了<stron

Easyui 去除jquery-easui tab頁div自帶滾動條

滾動 需要 bsp http alt right 需求 mage css 去除jquery-easui tab頁div自帶滾動條 by:授客 QQ：1033553122 測試環境 jquery-easyui-1.5.3 需求場景 打開tab頁面時，自動

div 加滾動條的方法：

關於div加滾動條div 加滾動條的方法：<div style="position:absolute; height:400px; overflow:auto"></div>div 設置滾動條顯示：overflow :yesdiv 設置滾動條自適應顯示：overflow :autodi

顯示一個帶滾動條的窗口

默認 processor += sprint 最終 button max val BE 1 //main.c 2 #include <windows.h> 3 #include "sysmets.h" 4 5 LRESULT CALLBA

JS之滾動條效果

mas 接下來 sem 分析 -c -s htm adding 開始 滾動條在前端頁面中是進行見到的，但是在不同的瀏覽器中，默認的滾動條樣式不同，有些瀏覽器的默認樣式也不好更改，因此，我們可以自定義滾動條，接下來就從一個實例開始進入滾動條。 簡易進度條 首先要實現的是上面

滾動的div隱藏滾動條

溢位隱藏，寫兩個div，高度都固定，外面的固定寬度overflow: hidden;裡面的div寬度比外面的稍寬，最好算好滾動條的寬度，overflow-y: auto即可 <div style="width: 500px;height: 250px;overflow: hidden;"&

使用ViewPager+Fragment來實現帶滾動條的多屏滑動-IndicatorFragmentActivity

分享一下我老師大神的人工智慧教程！零基礎，通俗易懂！http://blog.csdn.net/jiangjunshow 也歡迎大家轉載本篇文章。分享知識，造福人民，實現我們中華民族偉大復興！        

【Stimulsoft Reports.Net教程】帶滾動條的Web檢視器

下載Stimulsoft Reports.Net最新版本 預設情況下，檢視器將其自身大小調整為報表的大小。如果要顯示具有指定寬度和高度的檢視器，則可能存在檢視報表的整個頁面或頁面的問題。為此，它是一種帶滾動條的特殊模式。 要新增帶有滾動條的Web檢視器，只需設定檢視器元件的寬度和高度，並將特

給div新增滾動條

最簡單的方法： 　　<div style="height:300px;width:100px;overflow:auto"><div/>（height和width根據需求設定）　　 　　注意:如果只寫height就只有垂直滾動條，只寫width就只有水平滾動條,都不寫

給div加滾動條　div的滾動條設定

版權宣告：歡迎轉載 https://blog.csdn.net/qq_26173219/article/details/79785790 <div style=" overflow-y:auto; overflow-x:auto; width:400px; heigh

對話方塊自帶滾動條的使用

.h: CButton* m_pBtns; afx_msg void OnVScroll(UINT nSBCode, UINT nPos, CScrollBar* pScrollBar); afx_msg BOOL OnMouseWheel(UINT nFlags, short zDelta

div:給div加滾動條　div的滾動條設定

今天做了個例子： div 的滾動條問題： 兩種方法： 一、 <div style=" overflow:scroll; width:400px; height:400px;”></div> 記住寬和高一定要設定噢，否則不成的 不過在不超出時，會有下面的滾動條，所以不是最好的選擇

html自定義的DIV垂直滾動條

首先說一下自定義滾動條的一個要求：滑鼠滾動在它div上滾動時，如果沒有滾到頂端或底部則不能影響頁面滾動條和系統自帶一樣 讓一個div擁有滾動條 1、只有垂直滾動條 #mydiv1 {     position: relative;     overflow-x: hid

超出父容器時不要滾動條但是要滾動條效果

<html><head><title>留滾動效果，去除滾動條</title></head><style></style><body ><div id='father' sty

給div加滾動條 div顯示滾動條設定程式碼

今天做了個例子： div 的滾動條問題： 兩種方法： 一、  複製程式碼 程式碼如下: <div style=" overflow:scroll; width:400px; height:400px;”></div>  記住寬和高一定要設定噢，