如何停止水平滾動？

8

Sarfraz有already mentionedoverflow-x，這是一個答案，儘管它的意思（因爲它說！）是什麼，會一直關閉到現在無法是給用戶。這有用例，但主要是打擾有用戶無法訪問的內容是不希望的。

現在的問題是：爲什麼你會得到水平滾動？在正常情況下，瀏覽器將包裝內容，以便不需要任何水平滾動。如果用戶具有正常的窗口大小，則可以通過具有特定寬度的元素（通過樣式信息或具有非可打包內容（如大圖像））在設計中引起水平滾動。舉例來說，這不會需要水平滾動：

<p>...lots of text here...</p>

...但是這會：

<p style='width: 1200px'>...lots of text here...</p>

...如果用戶的瀏覽器窗口寬度小於1200個像素。

因此，如果讓內容不可用不是你想要的打算，我的答案是找到導致滾動和糾正它們的元素。

來源

2010-06-07 05:57:03

6

應用以下樣式該元素：

overflow-x:hidden;

，或者它應該是：

overflow:auto; 
overflow-x:hidden;

這將確保垂直滾動是有需要的時候。

來源

2010-06-07 05:32:26 Sarfraz

+0

是的，這可能會奏效。但只有在瀏覽器中，支持css3 – 2010-06-07 06:05:03

+0

@Oden：嗯？「溢出」已經存在於CSS 2.1中，請參閱[規範]（http://www.w3.org/TR/CSS2/visufx.html#overflow）。 – 2010-06-07 08:26:44

+1

，但它取決於包含哪些元素。請確保元素的父級具有您感興趣的最大合適寬度。 – pxl 2010-06-07 08:53:02

-2

如果您使用瀏覽器查看文件，可以通過將其設置爲百分比來設置內容的寬度。

來源

2010-06-07 05:43:03 Kangkan

0

如果我正確理解你的問題，你想阻止你的內容超出瀏覽器窗口的界限。很多時候，設計人員將其佈局寬度設置爲960像素，以便在頁面上設置固定寬度，這非常適合1024 x 768像素的計算機屏幕。根據以下評論，較小分辨率的計算機會因此而獲得滾動條。你會做的東西，如：

<html> 
<head> 
</head> 
<body> 
    <div style="width:960px; margin:0 auto;"> 
    ... The rest of your content goes here ... 
    </div> 
</body> 
</html>

您可以瞭解更多關於瀏覽器的寬度在這裏：

http://www.fivefingercoding.com/web-design/is-there-a-perfect-web-design-width

如果您發現該內容綿延超過這個幅度，那麼裏面的一個特定項目頁面太寬。自己查看頁面以確定它可能是什麼，或者爲我們的幫助提供堆棧溢出鏈接。給你舉個例子，有這其間上述股利會產生問題：

<table style="width:99999px;"> ... table stuff ... </table>

來源

2010-06-07 06:06:46 Matrym

+0

這實際上*會導致瀏覽器的滾動條出現，其寬度爲小於這個值。 – 2010-06-07 08:57:07

+0

是的，但我認爲海報的意圖是將頁面的大小設置爲正常的Web標準。希望960能給他提供背景。 – Matrym 2010-06-07 09:00:20

0

如果你想在每一個瀏覽器使用這個，你不應該沒有寬度增加的元素，然後它變得沒有水平溢出，在每個瀏覽器中。

來源

2010-06-07 06:08:11

+0

不正確：很寬的表格會導致水平溢出。 – 2010-06-07 08:28:31

+1

這是真的，但如果你想逃避這一點，你可以將這些單詞包裝在服務器端，這樣你就不會遇到任何問題。或者，在CSS中的另一個解決方案，把包含標籤，固定寬度和隱藏溢出，與自動高度，所以佈局不會破壞，並支持舊版瀏覽器（baah，我多麼討厭那些舊的瀏覽器... ） – 2010-06-07 08:45:29

0

如果你想要你的html.body或div液體;

div.sample{ width:100%;}

樣品的div將調整是否你的屏幕大或小/ 沒有滾動條/

來源

2010-06-07 11:26:34 spielersun

如何停止水平滾動？

回答

相關問題