国产在线网-免费福利在线观看-四虎影院色-九九色网站-久久99久久精品-欧美在线天堂-亚洲综合精品香蕉久久网97-91传媒免费观看-精品国产99久久久久久-日韩中文字幕在线视频-午夜视频在线视频-亚洲精品在线不卡-久久久久99精品-人人人超碰-亚洲国产经典-国精产品一区二区-影视先锋av资源

如果客戶問：什么是響應(yīng)式網(wǎng)站？建站公司的銷售人員必定會這樣回答——可以適應(yīng)不同屏幕的網(wǎng)站，在手機(jī)、PC、平板上都能打開。
如果一個稍微專業(yè)的人士問：響應(yīng)式網(wǎng)站中有哪些元素呢？未必能夠回答上來。

響應(yīng)式網(wǎng)站的特性
響應(yīng)式網(wǎng)站是由一位研發(fā)人員Ethan Marcotte提出的，他認(rèn)為響應(yīng)式網(wǎng)站應(yīng)該具備三個特性：
一是具備靈活的網(wǎng)頁布局；
二是具備靈活的圖片適應(yīng)；
三是具備靈活的媒體查詢，或者說媒體條件。
下面，我們分別對這三個特性進(jìn)行解讀。

靈活的網(wǎng)頁布局
網(wǎng)格這個術(shù)語在網(wǎng)站建設(shè)中越來越模糊。說您的站點必須由一個靈活的網(wǎng)格組成，并不意味著您只能從十幾個左右的大型網(wǎng)格系統(tǒng)中進(jìn)行選擇。為列、間距和網(wǎng)頁定義自己的參數(shù)通常是web設(shè)計的最佳解決方案，并且可以像現(xiàn)有的任何系統(tǒng)一樣靈活。
事實上，大多數(shù)現(xiàn)有的網(wǎng)格系統(tǒng)都限制使用CSS類來定義大小、空間和對齊方式。與編寫自己的網(wǎng)格相比，嘗試將這些限制疊加到響應(yīng)性web設(shè)計上可能比較棘手，也更耗時。無論是在使用預(yù)先制作的網(wǎng)格系統(tǒng)還是創(chuàng)建自定義解決方案，靈活網(wǎng)格系統(tǒng)真正重要的方面在于布局大小和間距的機(jī)制。
對于網(wǎng)頁設(shè)計師來說，這意味著放棄我們喜愛的像素，代之以使用百分比和em(相對度量單位)的網(wǎng)頁布局。
當(dāng)然，這并不意味著我們停止使用圖像編輯軟件中的像素(比如Photoshop、Fireworks等)。 靈活的網(wǎng)格，可根據(jù)瀏覽器視圖的大小更改布局。布局的變化可以通過流暢的動畫表現(xiàn)出來。

靈活的圖像
使用靈活的網(wǎng)格移動和縮放圖像是響應(yīng)式web設(shè)計的另一個關(guān)鍵特性。靈活的圖像常常讓web設(shè)計人員感到頭痛。當(dāng)我們想在更小的瀏覽設(shè)備上為文本內(nèi)容提供更多的空間時，使用寬度和高度HTML屬性來縮小圖片的大小，加載巨大的、超大的圖片，對于更快的web頁面加載時間來說不是一個好的實踐。
當(dāng)然，這一問題的嚴(yán)重程度也取決于站點的圖像質(zhì)量。隨著web設(shè)計的發(fā)展，我們不斷地看到包含越來越少不必要的圖片和庫存照片的站點。也許這是一個很好的時間來評估您的web設(shè)計是否需要像現(xiàn)在這樣注重圖像。
另一種縮放圖像的方法是用CSS裁剪它們。CSS overflow屬性使我們能夠為適應(yīng)新的顯示環(huán)境而動態(tài)裁剪圖像。
我們還可以在服務(wù)器上有多個版本的圖像，然后根據(jù)用戶代理使用服務(wù)器端或客戶端特性檢測和DOM操作動態(tài)地提供適當(dāng)大小的版本。

媒體查詢
媒體查詢也被稱之為媒體條件，指的是代碼可以根據(jù)屏幕大小來改變呈現(xiàn)的方式。
通常，人們認(rèn)為它們是響應(yīng)性設(shè)計的核心組件，而讓靈活的頁面組件成為可選的。實際情況是，如果沒有一個優(yōu)良的HTML和CSS基礎(chǔ)，媒體查詢幾乎毫無用處。
媒體查詢允許設(shè)計人員使用相同的HTML文檔構(gòu)建多個布局，方法是根據(jù)用戶特性(比如瀏覽器窗口的大小)選擇性地提供樣式表。其他參數(shù)包括方向(橫向或縱向)、屏幕分辨率、顏色(即屏幕可以呈現(xiàn)多少顏色)，等等。
媒體查詢并不是一種移動解決方案或平板電腦解決方案。相反，媒體查詢和響應(yīng)式設(shè)計讓我們能夠跳出屏幕大小或分辨率的限制，開始構(gòu)建能夠靈活適應(yīng)所有不同屏幕的網(wǎng)站。