作者rangerjero (遊俠傑洛)
看板Web_Design
標題Re: [問題] 快被ie和ff打敗..
時間Fri Jun 11 10:38:18 2010
<div style="position: relative; left: 0px; top: -500px; display:
block;border:1px solid red;"><img style="opacity: 0.99999; visibility:
visible;" src="images/p1.png" id="thephoto" onload="initImage()"
onchange="initImage()"></div>
上方為一大片空白的問題Code
看起來是架構的問題!
Firefox 有firebug 可以提供你即時的偵錯工具!
善用此工具可以解決在排版上的問題!
※ 引述《rainpo17 (貼)》之銘言:
: 感謝SJ大的贊助!!~~終於網頁長得比較正常一點了!
: http://users3.jabry.com/visource/test/index.html
: 但請教一下,下方為什麼會有這麼大的空白?找了一些資料,還是不太懂
: 而且使用body設定其height,也沒有用耶...
: 請問各位有什麼好方法嗎?
: 或者可以避免空白產生的辦法?或可以限制可scroll的範圍?可以嗎
: : 1. com-menu.html
: : 最外層的ID=box把所有的屬性拿掉只留下margin:0;和padding:0;
: : 並且加上width:800px
: : 這樣就可以直接把此區塊無邊界對齊並且設定區塊寬度範圍
: : 2. box 這個div最後有<p></p>的多餘空行,請刪掉
: : 3.版權宣告的<center>不是正確用法,請改成<p align="center">內容</p>
: : 4.選單中所有按鈕的position:relative;以及長寬設定都拿掉
: : (因為容器中有固定的圖片,所以長寬會自動設定)
: : 如此選單的部份應該就會正常了
: : 至於其他版面錯亂的部份因為涉及到浮動屬性和容器高度的限制,必須調整版面結構才行
: : 表格改成css第一件事情就是要分析版面的結構
: : 要善用div的巢狀排版,通常選單的部份會另外用一個div裡面在放入選單按鈕
: : 單純用表格排版的思維去轉換成css排版會變很複雜
: : ==
: : 大部分編寫的狀況下只要謹慎使用postion和注意margin的問題
: : 其實相容度都還不錯
: : 只是對於需要大量圖片構成的版面就要很小心
--
※ 發信站: 批踢踢實業坊(ptt.cc)
◆ From: 211.21.204.109
→ rangerjero:CSS 可以加入該圖片寬度與高度即可以解決問題! 06/11 10:42
推 darKyle:現在連IE都有都有開發工具囉... 雖然我還是習慣螢火蟲 06/11 11:23
→ darKyle:錯了 原來牠不是螢火蟲... 06/11 11:27
→ knives:不是小強嗎 06/11 13:15
→ hougzou: O.O「爹~這隻螢火蟲為什麼不會發光~~?」 06/12 18:31