如何讓它水平滾動？

文本

   <a href="html"><div id="right" class="box"> 
       <p>text</P> 
      </div></a>

CSS

#big{ 
    background-color: red; 
    width: 300px; 
    height: 250px; 
    border: thin solid black; 
    overflow-x: show; 
    overflow-y: hidden;

}}

.box { 
text-align: center;

}

來源

2016-11-03 noooooooo

你能否解釋一下什麼樣的建議你要嗎？ – Rohit

滾動什麼？我的意思是，你想滾動什麼？ –

你的html中的#big在哪裏？ – GvM

首先，您在CSS和html DOM元素中聲明瞭不同的ID名稱，請注意這一點。

其次，有沒有這樣的價值展現給overflow屬性，點擊這裏：http://www.w3schools.com/cssref/css3_pr_overflow-y.asp

HTML

<a href="html"> 
    <div id="right" class="box"> 
    <p>text</p> <p>texttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttexttext</p> <p>text</p> <p>text</p> <p>text</p> <p>text</p> <p>text</p> <p>text</p> <p>text</p> <p>text</p> <p>text</p> <p>text</p> <p>text</p> <p>text</p> <p>text</p> <p>text</p> <p>text</p> <p>text</p> <p>text</p> <p>text</p> <p>text</p> <p>text</p> <p>text</p> <p>text</p> <p>text</p> <p>text</p> <p>text</p> <p>text</p> 
    </div> 
</a>

CSS

#right{ 
    background-color: red; 
    width: 3200px; 
    height: 250px; 
    background: red; 
    border: thin solid black; 
    overflow-y: scroll; 
} 

.box { 
text-align: center; 
}

https://jsfiddle.net/13jh7gjb/2/

我希望它能幫助，只是刪除顏色我已添加爲您突出顯示div。

來源

2016-11-03 22:35:26

這是垂直滾動，OP要水平 – GvM

@GvM謝謝，已經糾正。 –

將以下CSS代碼添加到您的容器中。

overflow-x：scroll;

overflow-y：hidden;

來源

2016-11-03 22:45:35 Bnj

如果我明白你的要求，也許你會發現在這個崗位你的答案：

這裏StackOverflow後，這裏 JSFiddle

ul { 
 
    width: 160px; 
 
    display: block; 
 
    white-space: nowrap; 
 
    overflow: auto; 
 
    } 
 
li { 
 
    width: 80px; 
 
    display: inline-block; 
 
    }

<div> 
 
    <ul> 
 
    <li>one</li><li>two</li><li>three</li><li>four</li> 
 
    </ul> 
 
</div>

來源

2016-11-03 22:46:35

感謝它的工作原理以及我正在尋找的東西 – noooooooo

如何讓它水平滾動？

回答

相關問題