網頁中的定位

2022-08-31 10:45:12 字數 1528 閱讀 3600

1.1.1   網頁中的定位型別:

a)         靜態定位(static)是預設定位

b)         相對定位(relative)

c)         絕對定位(absolute)

d)         固定定位(fixed 瀏覽器對該定位存在相容性問題)

e)         參照物

1.1.2   相對定位

position:relative;

top:20px;參照頂部發生位置偏移20px

left:10px;參照左邊發生位置偏移 10px

right和bottom不常用。

注意:

例如:相對定位前:

相對定位後:

1.1.1   絕對定位

position:absolute;

top:20px;參照頂部發生位置偏移20px

left:10px;參照左邊發生位置偏移 10px

注意:

例如:絕對定位前

絕對定位後:黃色框發生定位,所以作為參照物

1.1.1   固定定位

固定定位和絕對定位基本是一致的,固定定位的元素不會隨著瀏覽器的滾動條而滾動。常見的網頁廣告就是這樣做的。

position:fixed;

top:40px;

left:300px;

CSS定位網頁中的元素

relative相對定位 偏移設定 left right top bottom 值單位 px元素的規律 相對定位元素的規律 設定相對定位的盒子會相對它原來的位置通過指定偏移,到達新的位置。設定相對定位的盒子仍在標準文件流中,它對父級盒子和相鄰的盒子都沒有任何影響 設定相對定位的盒子原來的位置會被保留...

詳解網頁設計中的定位與定位應用

定位一直是web標準應用中的難點,如果理不清楚定位那麼可能應實現的 效果實現不了,實現了的效果可能會走樣。如果理清了定位的原理,那定位會讓網頁實現的更加完美。定位的定義 在css 中關於定位的內容是 position relative absolute static fixed static 沒有特...

html網頁定位

網頁地理定位有兩種 1.對於擁有 gps 的裝置,比如 iphone,html5 geolocation api 可以獲得使用者的地理位置,internet explorer 9 firefox chrome safari 以及 opera 支援地理定位。2.對於未擁有gps的裝置,比如pc,就可以...