如何製作固定div？

我正在嘗試使框固定在頁面的右下邊框，並且不隨頁面向下滾動而移動。但它不適合我爲什麼不工作。這裏是我的代碼：如何製作固定div？

<html> 
<head> 

<style type="text/css"> 

.tooltip { 
width: 200px; 
position: fixed; 
top:auto; 
bottom:0px; 
right:0px; 
left:auto; 
} 
</style> 
</head> 
<body> 
<div class="tooltip"> 
    <div class="tooltip_top">1</div> 
    <div class="tooltip_con">2</div> 
    <div class="tooltip_bot">3</div> 
</div> 
</body> 
</html>

來源

2010-01-27 taabouzeid

工作正常。即使頂部和左側的自動值不是強制性的。有什麼問題？你使用哪個瀏覽器進行測試？ – gregseth 2010-01-27 23:21:36

它工作正常，在FF和Chrome .. IE的

舊版本不支持position:fixed正確..不知道最新版本..

還要確保你有一個doctype定義..

來源

2010-01-27 23:19:59

只有在添加文檔類型後才能使用。 Thanx :) – taabouzeid 2010-01-27 23:26:40

呃，應該工作。也許刪除top: auto？

（它不會在IE 6的工作，雖然，因爲IE 6不支持position: fixed。

來源

2010-01-27 23:21:23

似乎是爲我工作....我相信，在IE7和更高您需要定義一個DOCTYPE，搜索「怪癖模式」，如果你不知道從哪裏開始對

我不認爲IE6支持位置：。固定

來源

2010-01-27 23:23:08 dpb

如果你想保存一些字節，你是正確的先生，使用絕對定位工程。 – 2010-01-27 23:26:49

你的HTML/CSS僅在IE破碎變化從position: fixed;到position: absolute;，它應該更像你想要的。

您還可以將文檔類型元素：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

來源

2010-01-27 23:24:39

是的，有兩兩件事要照顧

寫DOCTYPE，但過渡之一！
「位置：固定」的CSS屬性不支持IE6 ...所以你最好使用「位置：絕對」......所有其他屬性保持不變。

來源

2011-10-06 20:04:27 Devanand

這一切的答案有「大碼」爲什麼只是不添加「固定」到div元素像這樣：

div position: fixed;

這「S是：d 希望它爲你工作

來源

2013-01-08 17:54:53 user1959021

<html> 
<head> 
<style type="text/css"> 
.header { 
width: 100%; 
height:100px; 
position: fixed; 
top:0px; 
left:0px; 
} 
</style> 
</head> 
<body> 
<div class="tooltip"> 
    <div class="tooltip_top">1</div> 
    <div class="tooltip_con">2</div> 
    <div class="tooltip_bot">3</div> 
</div> 
</body> 
</html>

來源

2015-02-18 05:11:02

任何位置相關的問題，然後查看這個鏈接你可以快速的解決方案。

http://learnlayout.com/position.html

固定

固定元件相對於視口，這意味着它總是停留在即使頁面滾動相同的地方定位。與相對一樣，使用頂部，右側，底部和左側屬性。

我相信你已經注意到頁面右下角的固定元素。我現在允許你注意它。這裏是把它在那裏的CSS：

.fixed { 
    position: fixed; 
    bottom: 0; 
    right: 0; 
    width: 200px; 
    background-color: white; 
}

相對

相關的行爲與靜態，除非你添加一些額外的屬性。

.relative1 { 
    position: relative; 
} 
.relative2 { 
    position: relative; 
    top: -20px; 
    left: 20px; 
    background-color: white; 
    width: 500px; 
}

絕對

絕對是最棘手的位置值。除了相對於最近的定位祖先而非相對於視口，絕對行爲像固定。如果一個絕對定位的元素沒有定位祖先，它使用文檔主體，並且仍然隨頁面滾動一起移動。請記住，「定位」元素的位置是除靜態以外的任何元素。

下面是一個簡單的例子：

我

.relative { 
    position: relative; 
    width: 600px; 
    height: 400px; 
} 
.absolute { 
    position: absolute; 
    top: 120px; 
    right: 0; 
    width: 300px; 
    height: 200px; 
}

來源

2015-02-18 05:16:05

如何製作固定div？

回答

相關問題