響應(yīng)式設(shè)計(jì)技術(shù)在視頻網(wǎng)站開發(fā)中的應(yīng)用.pdf

1、隨著計(jì)算機(jī)技術(shù)的不斷發(fā)展，網(wǎng)絡(luò)用戶使用小屏幕移動(dòng)設(shè)備（如平板電腦、手機(jī)）上網(wǎng)已成為趨勢，另外超大屏幕顯示器也在快速的普及，從而導(dǎo)致上網(wǎng)設(shè)備的尺寸差距與日俱增。面對(duì)形形色色的終端設(shè)備和千差萬別的屏幕分辨率，傳統(tǒng)的網(wǎng)頁設(shè)計(jì)方法顯得有些力不從心，而設(shè)計(jì)師不可能為每種終端設(shè)備專門設(shè)計(jì)一套網(wǎng)站系統(tǒng)。本文嘗試通過響應(yīng)式設(shè)計(jì)的開發(fā)方式，構(gòu)建一個(gè)使系統(tǒng)頁面隨接入設(shè)備的顯示大小不同而自行響應(yīng)、動(dòng)態(tài)調(diào)整布局結(jié)構(gòu)、元素規(guī)格樣式，將相同的內(nèi)容以不同的格式呈現(xiàn)給

2、不同設(shè)備的用戶的系統(tǒng)。通過設(shè)計(jì)這樣的交互系統(tǒng)，可以達(dá)到利用同一套代碼，使網(wǎng)站內(nèi)容在PC、平板電腦以及智能手機(jī)瀏覽器上都能正常的顯示的目的。
　　本論文的工作，針對(duì)上海市松江大學(xué)城體育視頻網(wǎng)站的需求進(jìn)行設(shè)計(jì)開發(fā)。論文首先對(duì)課題的研究背景和國內(nèi)外研究現(xiàn)狀做了較為深入的分析。在此基礎(chǔ)上，首先對(duì)課題研究中所用到的響應(yīng)式設(shè)計(jì)技術(shù)、以及與之相關(guān)的技術(shù)進(jìn)行了介紹。然后對(duì)項(xiàng)目網(wǎng)站進(jìn)行全面的需求分析，之后利用面向?qū)ο蟮乃枷牒图夹g(shù)進(jìn)行了網(wǎng)站系統(tǒng)的概要

3、設(shè)計(jì)、詳細(xì)設(shè)計(jì)、系統(tǒng)實(shí)現(xiàn)和系統(tǒng)測試。系統(tǒng)完成的主要功能包括:
　　1)運(yùn)用HTML5結(jié)合jQuery技術(shù)進(jìn)行自定義視頻播放器;
　　2)運(yùn)用MediaQuery技術(shù)實(shí)現(xiàn)不同終端上頁面的特定樣式;
　　3)每張頁面都采用彈性布局，使頁面元素可以隨頁面顯示大小變化而進(jìn)行調(diào)整;
　　4)利用Viewport技術(shù)對(duì)網(wǎng)頁縮放進(jìn)行控制;
　　5)完成系統(tǒng)管理，如視頻管理、學(xué)校管理、用戶管理。
　　通過該網(wǎng)站的建設(shè)