HTML從Windows更改爲Mac

所以我寫了一個投資組合網站，但是我遇到了一些麻煩。我在Windows 7機器上寫了這個網站，但是在家裏我使用了一個mac。 Windows機器是一個15「的屏幕，並確認不同分辨率的Mac 13」。基本上，問題是我有一個側邊欄div，它在mac上查看時會向下移動，並且是在Windows計算機上查看時所需的位置。我已經包含了一些屏幕截圖，所以你明白了。第一個是Windows 7，第二個是Mac OSX。HTML從Windows更改爲Mac

Viewed on Windows

farm8.staticflickr.com/7373/8753141625_140ecbb3ce_b.jpg（在Mac上觀看）

我原來做了幾處修改。下面是代碼，然後我將解釋什麼我已經嘗試：

<div id="hello" class="container clearfix scroll-content"> 

<h1>Hello!</h1> 

<h2>Allow me to Introduce myself:</h2> 
<h2>My Name is <span class="cas">Dom Greenslade</span></h2> 
<h3><span class="experience">5</span>Years of Web Development Expereince</h3> 
<h3><span class="me">Bachelors Degree</span> in <span class="me">Computer Science</span> Specialising In Programming and Scripting</h3> <br> 
<h3>Born, Bred and Reside in: Poole, Dorset</h3><br> 
<h3>Currently employed by: Foray Motor Group as Web and Ecommerce Developer</h3> <br> 


<div class="process"> 
How it's done 

<img src="images/process2.png" height="460px"> 
</div> 

</div>

和CSS：

.process{ 
position: relative; 
bottom: 460px; 
left:900px; 
width: 150px; 
height: 500px; 
}

看到完整的代碼，讓我知道，我可以複製完整的網站在這裏，或者你可以查看www.domgreenslade.webuda.com的開發網站

所以繼承人我試過的：將某些值更改爲百分比而不是px。

繼承人變得有趣。我正在抓着吸管，看看發生了什麼事情，並在鉻內檢查元素（瀏覽器我設計的網站），甚至標題的大小是不同的兩個操作系統。它們是不同的分辨率，但即使當我更改Macbook上的分辨率時，側邊欄（進程）仍保留在原來的位置。第一個在Windows上，第二個在Mac上。注意h1大小的差異？ 46px和43px取決於操作系統？我該如何解決這個問題？它真的搞亂了網站！

Windows view

（HTTP：在Mac

看

真的老老實實現在卡住/farm4.staticflickr.com/3707/8754266312_7921962613_b.jpg，我錯過什麼還是什麼我做錯任何幫助嗎？是極大的讚賞。

非常感謝

來源

2013-05-19 Dom Greenslade BSc

或者，您可以使用CSS重置文件來平衡交叉瀏覽器中的不一致性。

一個廣泛使用的CSS重置文件是Meyer的CSS重置。 http://meyerweb.com/eric/tools/css/reset/

請注意，將CSS重置文件應用到您的代碼現在可能會弄亂一些其他的東西（如粗體不會默認爲粗體）。

來源

2013-05-19 15:03:48 lunateck

網具有大部分然而每一個瀏覽器中斷這些標準不同，以及人民對電腦前的個人設置標準。卵石n分辨率和字體設置。

我會怎麼做來糾正佈局寬度來嘗試套用所有瀏覽器並幫助其他人的屏幕分辨率將設置Liquid-max-min佈局。

body{ 
    width:95%; max-width:1200px; min-width:960px; <!-- These numbers you would have to adjust --> 
}

對於H1通過使用百分比或小，中，大是跨瀏覽器我調整，以及不同的尺寸，X-大，從設定字體大小，以像素送花兒給人留下。

h1{ 
font-size:300%; <!-- 100% is normal size font so we are multiplying by 3 to be 3x larger--> 
}

保持調整他們，你會得到你喜歡的東西。

當你測試這些時，我會在你所有的瀏覽器中嘗試它們，以確保你有一個外觀和感覺，讓你在晚上睡得好。 :)

來源

2013-05-19 14:52:48 RedRumming

跨瀏覽器/平臺兼容性是一個常見問題，並且有很多項目試圖找到解決方案。你正在談論的這個問題我使用「HTML5 Boilerplate」來解決。我使用它，我可以告訴你這是一個很好的解決方案，我很確定你可以通過使用它來解決這個問題。

來源

2013-05-19 15:03:09

HTML從Windows更改爲Mac

回答

相關問題