響應式網頁設計

-2

我開發了自己的介紹性網站（ASP.NET）。我只使用HTML和CSS，因爲我不擅長網站設計。但該網站在手機瀏覽器上看起來不太好。任何人都可以建議我如何使用/更新相同的代碼，以便在手機瀏覽器中看起來不錯，而且不明確使用引導程序？響應式網頁設計

my website link

來源

2017-01-29 kaushal sanadhya

如果有人對此問題不滿意，請添加評論以使其更加清晰，而不是對其進行投票。 –

Asp.NET無關，採用自適應網頁設計在這裏做。

只需根據分辨率和正確的設置正確創建CSS，即可根據需要設置元素。

要針對特定分辨率下使用媒體查詢：分辨率

@media screen and (min-width: 480px) { 
    a { 
    color: red; 
    } 
}

來源

2017-01-29 18:38:28

我已經開發了代碼。是否有任何方法來轉換相同的代碼，以便網站變得快速響應？某些工具等。 –

他爲您提供了使網站響應所需的CSS。使用開發人員工具（鍵盤上的F12）來調整頁面大小，以查看您的網站發生的變化。像上面提供的那樣添加「媒體中斷點」來更改網站的樣式，以修復看起來不好的任何內容。我強烈建議你閱讀一些關於響應式設計的文章。您還應該考慮設計符合移動設備的網站，並在Photoshop，移動設備和桌面尺寸中創建至少2個模型，以便您在更改CSS時擁有明確的目標。 – SeanKendle

您也可以使用瀏覽器developer tools，看看你的頁面的外觀在不同的屏幕尺寸

來源

2017-01-29 18:42:58 krlos77

你沒有得到我的觀點!!我已經開發了整個網站，現在有什麼方法可以將它「轉換」爲響應式網站？ –

即使你不想使用引導或基金會，看他們的CSS，看看它是如何運作的，我是如何學會創建響應式頁面的。

引導程序的核心是引用上面提到的Pawel Lukasik的頁面寬度。在最簡單的情況下，某個寬度將有1個樣式，並且在一定寬度以下時，將會有另一個樣式確定頁面上該內容的位置/寬度/浮點數。

在引導的情況下，他們已經使用鑑定這些風格各異的各種「網格選項」 http://getbootstrap.com/css/#grid-example-basic

來源

2017-01-29 18:50:04 hyperman

我建議你看一看以下link。它將爲您提供CSS中用於響應式設計的媒體查詢的簡要介紹。如上所述，查看Bootstrap的代碼也是一個非常好的主意。它會讓你知道它是如何實現響應的，然後你可以嘗試創建你自己的CSS來達到預期的結果。

來源

2017-01-29 23:14:55 Sylvoo

響應式網頁設計

回答

相關問題