前言

現(xiàn)在使用移動設(shè)備人越來越多,移動版的Website隨之也越來越重要;但是移動端設(shè)備的大小不一,屏幕分辨率各不相同,我們不可能為BlackBerry,iPhone, iPad等等每個都做單獨的頁面設(shè)計。所以我們需要的Website設(shè)計要能迎合多種device的要求并且兼容所有的屏幕分辨率,這種設(shè)計就叫響應(yīng)式Web設(shè)計
什么是響應(yīng)式Web設(shè)計(Responsive Web design)?
響應(yīng)式Web設(shè)計是一種Web設(shè)計和開發(fā)能夠根據(jù)屏幕大小、平臺和方向?qū)τ脩舻男袨楹铜h(huán)境做出響應(yīng)的設(shè)計。它包括了靈活的網(wǎng)格和布局,圖像和智能使用CSS的media queries特性。當(dāng)用戶從Laptop切換到iPad上時,該網(wǎng)站應(yīng)能自動地切換CSS規(guī)則以適應(yīng)Device分辨率,圖像尺寸和腳本執(zhí)行。換句話說,響應(yīng)式Web設(shè)計是具備能夠自動響應(yīng)用戶喜好的技術(shù)。這將一勞永逸的滿足對每個新上市的移動終端都要進(jìn)行不同設(shè)計和開發(fā)的需求。
需要注意的是:響應(yīng)式Web設(shè)計不僅僅是可調(diào)屏幕分辨率和可自動調(diào)整大小的圖像,而且更是一種采用全新思考的Website設(shè)計方法。
響應(yīng)式Web設(shè)計的用途
隨著越來越多的設(shè)備而來的是各式各樣的屏幕分辨率、定義和方向。每天都有正在開發(fā)的新屏幕尺寸的設(shè)備。每個設(shè)備都可以擁有不同的尺寸、功能、甚至顏色。有些是橫向,有些是縱向,甚至還有些完全是正方形的。如圖所示:
下圖列出了一些最常見的:
所以,如果你要使你的客戶滿意,你必須讓你的網(wǎng)站能夠自動調(diào)整并適合上述設(shè)備的屏幕。例如,你應(yīng)該為不同的設(shè)備定制不同的布局結(jié)構(gòu):
定制布局
同樣,有些時候,根據(jù)需要顯示或隱藏一些內(nèi)容:
顯示或隱藏內(nèi)容
網(wǎng)站欄目:學(xué)習(xí)之響應(yīng)式Web設(shè)計:MediaQueries和Viewports
網(wǎng)站URL:http://chinadenli.net/article16/cgesgg.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供標(biāo)簽優(yōu)化、外貿(mào)網(wǎng)站建設(shè)、虛擬主機、網(wǎng)站設(shè)計公司、App開發(fā)、網(wǎng)站策劃
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)