第二步HTML結(jié)構(gòu) 在這個(gè)例子里，我有一個(gè)包括頭部內(nèi)容側(cè)邊欄和頁腳的基本頁面布局頭部有固定的高度180像素，內(nèi)容容器是600像素而側(cè)邊欄是300像素第三步媒介查詢Media Queries CSS3 Media Query媒介查詢是響應(yīng)式設(shè)計(jì)的核心它根據(jù)條件告訴瀏覽器如何為指定視圖寬度渲染頁面當(dāng)視圖寬度為小于。

2基于網(wǎng)站欄目功能構(gòu)建移動網(wǎng)站效果 這種方法主要強(qiáng)調(diào)數(shù)據(jù)的統(tǒng)一性對于管理后臺，在添加信息時(shí)，只需添加一次即可在管理和維護(hù)時(shí)，會更方便3響應(yīng)式網(wǎng)站 手機(jī)版網(wǎng)頁制作現(xiàn)在我們用的比較靈活的就是響應(yīng)式網(wǎng)站了，響應(yīng)式網(wǎng)站不管是對于pc端還是移動端的網(wǎng)站都是可以支持的，是現(xiàn)在很多人都會采用的。

g 響應(yīng)式web設(shè)計(jì)之液態(tài)圖片要實(shí)現(xiàn)液態(tài)圖片，只需加入如下代碼imgmaxwidth100% web移動頭部書寫 1首先我們來看看webkit內(nèi)核中的一些私有的meta標(biāo)簽，這些meta標(biāo)簽在開發(fā)webapp時(shí)起到非常重要的作用 這個(gè)meta標(biāo)簽表示強(qiáng)制讓文檔的寬度與設(shè)備的寬度保持11，并且文檔最大的寬度比例是10。

3移動模板對應(yīng)PC模板，程序文件和pc一樣只是數(shù)據(jù)庫是共用一個(gè)4在PC頁面上面設(shè)置移動跳轉(zhuǎn)判斷，網(wǎng)上有PHP跳轉(zhuǎn)代碼5你可以參考開源程序制作移動端，比如dedecms，帝國cms制作移動端，如果感覺比較麻煩了，那就直接把PC頁面重寫，頁面直接修改成響應(yīng)式現(xiàn)在做網(wǎng)站手機(jī)站必須要做，手機(jī)上搜索越來越。

這種方式無論從交互設(shè)計(jì)還是UI視覺等方面，其實(shí)仍屬于相對傳統(tǒng)的頁面設(shè)計(jì)開發(fā)模式，并不會增加太多的成本，可以說是一種性價(jià)比很高的選擇 關(guān)于響應(yīng)式Web設(shè)計(jì)的概念組成要素基本實(shí)現(xiàn)思路和開發(fā)方式等，可以參考之前的兩篇文章“什么是響應(yīng)式Web設(shè)計(jì)？怎樣進(jìn)行？” 以及 “通過CSS3 Media Query實(shí)現(xiàn)響應(yīng)。