一行超出的內容預設是垂直方向顯示滾動條，如果需要水平方向滾動條

主要用到並排Div 的父級設定white-space: nowrap，並排的div設定display:inline-block;

因為display:inline-block 會引起幾個畫素的空隙，需要在父級設定font-size:0;可以去掉相鄰小div的空隙

完整的程式碼如下：

<div class="" id="ta_1" style="overflow-x:auto;">
    <div class="all-smallImg-wrap">
        <div class="smallImg-wrap">
            <div class="smallImg">
                <img src="../../dist/img/login-bg1.jpg" alt="" />
            </div>
            <div class="title">標題11</div>
        </div>
        <div class="smallImg-wrap">
            <div class="smallImg">
                <img src="../../dist/img/login-bg1.jpg" alt="" />
            </div>
            <div class="title">標題11</div>
        </div>
        <div class="smallImg-wrap">
            <div class="smallImg">
                <img src="../../dist/img/login-bg1.jpg" alt="" />
            </div>
            <div class="title">標題11</div>
        </div>
    </div>
</div>
 

.all-smallImg-wrap{height:160px;white-space: nowrap;font-size:0;}
.smallImg-wrap{width:25%;display:inline-block;height:160px;padding-right:15px;}
.smallImg-wrap .smallImg{border:1px solid #ccc;text-align:center;display:table-cell;width:1%;vertical-align:middle;height:130px}
.smallImg-wrap .smallImg img{max-width:100%;max-height:100%;}
.smallImg-wrap>div.title{text-align:center;line-height:30px;font-size:14px;} 
 

            
  
           

              
              
            
            
相關推薦
			   
            
            
            
 

    

    
    
GridView顯示水平滾動條
     
 顯示   veh   eve   view   lag   orz   auto   option   false   this.gridView.OptionsView.ColumnAutoWidth = false;this.gridView.ScrollStyle = ScrollStyleFlags. 

  
 

    

    
    
[TimLinux] JavaScript position為fixed時支持水平滾動條
     
 縮小   導致   gif   函數   false   spl   document   沒有   pla   1. 固定定位
position: fixed;設置好之後，元素在瀏覽器窗口中的位置就固定住了，這個時候，不論是水平移動滾動條，還是垂直移動滾動條，元素是打死都不會動的。
但是當用fixed定位的 

  
 

    

    
    
jqGrid設定水平滾動條
     
  
 
 預設情況下是沒有開啟水平滾動條的，也就是說無論有多少欄位，都會顯示在這一屏。 
  
 問題：jqGrid顯示的內容的列寬並沒有按照設定的列寬顯示。列被壓縮。則按比例初始化列寬度 
 原因：shrinkToFit為預設值。 
 解決辦法： 
 
  
   
    shrinkToFit 
    

  
 

    

    
    
python3中給listbox新增垂直滾動條和水平滾動條
     
 
							
							
							#scrolly是垂直滾動條，scrolly2是水平滾動條
scrolly=Scrollbar(win,width=25,orient=VERTICAL)
scrolly.grid(row=0,column=1,padx=(0,0),pady=(250,0),s 

  
 

    

    
    
LigerUI 設定選中行顏色改變與設定水平滾動條不顯示
     
 
								
								            
						
                

.l-grid-body 
{
position: relative; width:100%;
    top: 0px;
    left: 0px; 
    overflow: none; 

  
 

    

    
    
如何在DIV內只要垂直滾動條，不要水平滾動條
     
 
                

<DIV style="OVERFLOW-Y: scroll; OVERFLOW-X:hidden; width: 685px; height: 180px"><DIV>

說明: 

overflow-y: scroll   - 有垂直滾動條

 

  
 

    

    
    
CComboBox增加水平滾動條
     
  
  
  
 1. 新增WS_HSCROLL樣式 
 使用記事本開啟.rc資原始檔增加WS_HSCROLL樣式(VS的資源編輯視窗中無法新增)，如下圖所示。  
 2.新增如下程式碼 
 void CXXXDlg::AddHScroll(UINT idComboBox)
{
    CComboBox * 

  
 

    

    
    
easyui datagrid 表頭固定（垂直滾動條）、列固定（水平滾動條）
     
 
 easyui datagrid 表頭固定（垂直滾動條）、列固定（水平滾動條），每頁顯示1000行
 
 
 最近用多了easyui 之後還是覺得它的功能還是很強大的。它原有的功能就已經能夠滿足90%以上的介面需求。 
 1、當資料行很多時，會呈現垂直的滾動條，但是向下滾動，表頭卻被淹沒了，這不符合人類偷懶 

  
 

    

    
    
bootstrap柵欄佈局下水平滾動條的處理
     
 
								
								            
						
                

Bootstrap的柵欄佈局，本意是將當前瀏覽器視窗，劃分為12列，來進行自適應，以求達到可以相容各個大小的瀏覽器視窗
然而我遇到了，有表格（而且表格特別多列） 
 需求：需要水平滾動條的
解決辦法 

  
 

    

    
    
為ListBox控制元件新增水平滾動條
     
 
                Win32的標準控制元件之中，列表控制元件（ListBox）並沒有和列表檢視（ListView）一樣提供水平滾動條，所以如果列表項的長度超過列表的寬度的話，那麼超出的部分將無法顯示。在本文中我將以一個簡單的例子來說明如何使用SDK來解決這一問題，在這個例子中，我將為一個列表控 

  
 

    

    
    
WPF Treeview禁止水平滾動條自動滾動
     
 
                
Wpf的treeview，當item超過treeview的範圍時，當點選這個item，會把這個item移到treeview的最左邊。
不想要這個效果。
需要在treeviewitem的style里加eventsetter
<TreeView>
    <T 

  
 

    

    
    
xtragrid 顯示水平滾動條
     
 
                
 this.gridView.OptionsView.ColumnAutoWidth = false;
 this.gridView.ScrollStyle = ScrollStyleFlags.LiveHorzScroll | ScrollStyleFlags.LiveV 

  
 

    

    
    
jqgrid 新增水平滾動條
     
 
                
<div style="overflow-x:auto"><table id="treegrid2"></table></div>
通過設定：
shrinkToFit:false,  
autoScroll: true, 

 

  
 

    

    
    
水平滾動條
     
 
                                        
                                                一行超出的內容預設是垂直方向顯示滾動條，如果需要水平方向滾動條 
主要用到並排Div 的父級設定white-space: nowr 

  
 

    

    
    
CSS——水平(橫向滾動條)
     
 
                
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<style&g 

  
 

    

    
    
bootstrap table 實現固定懸浮table 表頭並可以水平滾動
     
 app   實現   question   get   net   width   class   pan   eight   在開發項目中，需要將表格頭部固定，而且表格大多數情況下是會水平滾動的。項目的css框架是bootstrap 3，故也可以叫做bootstrap table。
需要實現的是：表格頭部 

  
 

    

    
    
FineUIMvc新特性速遞（大間距模式，隱藏菜單垂直滾動條）
     
 android   密集恐懼癥   在線   網站   先來   即將發布的 FineUIMvc 新版本會引入兩個重要的特性，用來提升用戶體驗，現在就來先睹為快吧：大間距模式我們已經支持的顯示模式有：緊湊模式，普通模式，大字體模式。緊湊模式： 普通模式： 大字體模式（一般適用於移動端顯示，iOS，Androi 

  
 

    

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

  
 

    

    
    
angularjs 水平滾動選中按鈕高亮顯示 swiper和回到頂部指令的實現ionic
     
 cor   load   sse   component   邏輯   return   position   col   href   首先安裝 swiper  npm install --save swiper   或者 bower install --save swiper

<link rel= 

  
 

    

    
    
CSS3自定義滾動條樣式 -webkit-scrollbar
     
 play   偽類   thumb   area   沒有   :link   現在   自定義滾動條   box   ::-webkit-scrollbar {/*隱藏滾輪*/display: none;}
前言
webkit支持擁有overflow屬性的區域，列表框，下拉菜單，textarea的滾動條自定