首先需要考慮是全平臺適配還是只是移動端適配這里以移動端響應(yīng)式網(wǎng)站為例，講述如何制作響應(yīng)式網(wǎng)頁#xF4CF選定基本設(shè)計尺寸選定基本設(shè)計尺寸，一般以1080為基準(zhǔn)確定響應(yīng)式web設(shè)計的應(yīng)用場景之后，和美工或設(shè)計師溝通，之前，一般需要美工出幾套主流移動設(shè)備屏幕分辨率的設(shè)計圖，現(xiàn)在，使用流式布局以及rem等可以使用一套設(shè)計。

1設(shè)計能反映網(wǎng)站內(nèi)容的logo，并且將logo放在網(wǎng)站的醒目位置2網(wǎng)站的顏色要統(tǒng)一，要突出網(wǎng)站的主調(diào)色彩3相同類型的圖像要有相同的效果4網(wǎng)站要有一句明晰的宣傳標(biāo)語三網(wǎng)站布局類型 1國字型布局 這種布局類型分為上邊欄左邊欄中間內(nèi)容區(qū)右邊欄和底部的頁腳區(qū)域，其形狀酷似一個“國”。

1活動運營型 為活動推廣運營而打造的H5頁面是最常見的類型，形式多變，包括游戲邀請函賀卡測試題等形式與以往簡單的靜態(tài)廣告圖片傳播不同，如今的H5活動運營頁需要有更強的互動更高質(zhì)量更具話題性的設(shè)計來促成用戶分享傳播從進入微信H5頁面到最后落地到品牌App內(nèi)部，如何設(shè)計一套合適的引。

如果對于簡答，優(yōu)雅，容易閱讀的代碼有所偏好的話，HTML5絕對是一個為量身定做的東西HTML5允許寫出簡單清晰富于描述的代碼符合語義學(xué)的代碼允許你分開樣式和內(nèi)容看看這個典型的簡單擁有導(dǎo)航的heaer代碼ltdiv id=quotheaderquot lth1Header Textlth1 ltdiv id=quotnavquot ltul ltlilta href=quot#quot。

3Jo該框架可以創(chuàng)建像本地一樣的應(yīng)用，并且兼容任何操作系統(tǒng)，無論是BlackberryiOS還是Android并且提供許多HTML5小部件使用它可以解決任何動畫設(shè)計方面的問題4SenchaTouchSenchaTouch是第一個基于HTML5的移動應(yīng)用框架，利用JavaScriptHTML5和CSS3來構(gòu)建移動應(yīng)用程序，該框架利用本地代理存儲離線數(shù)據(jù)。

廣義論及HTML5時，實際指的是包括HTMLCSS和JavaScript在內(nèi)的一套技術(shù)組合它希望能夠減少網(wǎng)頁瀏覽器對于需要插件的豐富性網(wǎng)絡(luò)應(yīng)用服務(wù)PluginBased Rich Internet Application，RIA，例如Adobe FlashMicrosoft Silverlight與Oracle JavaFX的需求，并且提供更多能有效加強網(wǎng)絡(luò)應(yīng)用的標(biāo)準(zhǔn)集2具體來。

一web應(yīng)用更容易開發(fā) HTML5的規(guī)范都是基于用戶優(yōu)先準(zhǔn)則來編寫的，貼合開發(fā)者的編碼習(xí)慣，語法限制不嚴(yán)，代碼也更為精簡，更易于閱讀二功能強大，用戶體驗佳 HTML5視頻播放起來更流暢清晰，也更省電HTML5游戲小巧流暢，畫面質(zhì)量高，操作易上手HTML5廣告擺脫了以前網(wǎng)頁廣告的懸浮滾動和彈出。

1 Adobe Dreamweaver這是一款專業(yè)的網(wǎng)頁設(shè)計和開發(fā)工具，支持HTML5CSS3等前端技術(shù)，提供了豐富的代碼編輯和調(diào)試功能，方便開發(fā)者制作響應(yīng)式和移動優(yōu)化的網(wǎng)頁同時，它還支持團隊協(xié)作和版本控制功能軟件介紹集成開發(fā)環(huán)境Dreamweaver提供了一個集成的開發(fā)環(huán)境，包含了代碼高亮自動完成和錯誤檢查等。

第一大原因 它是未來，開始用吧最大的原因今天就開始使用HTML5是因為它是未來，不要掉隊了HTML5不會往每個方向發(fā)展，但是更多的元素已經(jīng)被很多公司采用，并且開始著手開發(fā)HTML5其實更像HTML，它不是一個新的技術(shù)需要你重新學(xué)習(xí)如果開發(fā)XHTML strict的話現(xiàn)在就已經(jīng)在開發(fā)HTML5了為什么不更。

逗自適應(yīng)網(wǎng)頁設(shè)計地的核心，就是CSS3引入的 Media Query模塊它的意思就是，自動探測屏幕寬度，然后加載相應(yīng)的CSS文件上面的代碼意思是，如果屏幕寬度小于400像素maxdevicewidth 400px，就加載tinyScreencss文件如果屏幕寬度在400像素到600像素之間，則加載smallScreencss文件除了用html標(biāo)簽。

HTML5的移動端網(wǎng)頁設(shè)計稿，通常情況下，內(nèi)容區(qū)為750px或960px或者1080px的，一般不小于750px像素大小寬度設(shè)計稿可以比750px大，但是絕對不能比750px小，這個主要是由于當(dāng)前手機的分辨率相對較高iPhone 6是375物理像素，但實際像素為其兩倍，也就是750，這個750就是這么來的如果設(shè)計圖稿過小。

下面是表單代碼，你直接再加屬性就可以了，表單用 table 寫比較簡單，div 太麻煩了lthtml xmlns=quot quot lthead ltmeta。

通過把元素嵌套進 a 里使其變成一個鏈接將 img 嵌套進 a 元素中 如果我們要把圖片嵌套進 a 元素， 可以這樣寫HTML 中有用于創(chuàng)建有序列表的特定元素有序列表以 ltol 開始，中間包含一個或多個 ltli 元素 最后以 ltol 結(jié)束例如注意 別忘了 input 元素是 quot自閉和標(biāo)簽quot。

html是一種超文本標(biāo)記語言，h5是就是html的第五代簡稱h5包含了html所有技術(shù)點，比如網(wǎng)頁設(shè)計，網(wǎng)頁上面的圖片文字視頻的顯示和排版技術(shù)h5課程一般包含傳統(tǒng)網(wǎng)頁設(shè)計技術(shù)新型網(wǎng)頁設(shè)計UI設(shè)計比如h5海報設(shè)計等等由于h5使用場景位居前段，所以課程還會涉及一些產(chǎn)品和用戶體驗以及設(shè)計的內(nèi)容。

2前端后臺的區(qū)別無論HTML5還是iOS，在整個網(wǎng)頁開發(fā)流程中，前端HTML5開發(fā)工程師，主要負責(zé)的是“前臺頁面制作”，“網(wǎng)站測試”，“修改”三個部分3HTML5與網(wǎng)頁設(shè)計與制作的區(qū)別原有的網(wǎng)頁設(shè)計與制作，主要針對PC平臺，進行網(wǎng)頁網(wǎng)站的設(shè)計與制作，相對會涉及一部分設(shè)計工作，并將美工圖實現(xiàn)。

想要video能自動填充慢父div的大小，只要給video標(biāo)簽加上style=quotwidth= 100% height=100% objectfit fillquot即可objectfit語法 objectfit屬性的語法非常的簡單objectfitfill contain cover scaledown objectfit取值說明 objectfit主要適合于替換元素，比如ltvideolt。