導語：了解完百度mip之后，很多站長不知道該怎么使用，如何去創(chuàng)建mip頁面呢？創(chuàng)建一個基本的MIP HTML頁面包括五步，分別是創(chuàng)建基礎MIP HTML頁面、引入圖片、調(diào)整樣式和布局、預覽和驗證。下面我們詳細的介紹一下具體的步驟。

首先是創(chuàng)建基礎的MIP HTML頁面

下面這段代碼是一個基礎的 MIP HTML 的 demo 。將它復制到html文件中，并根據(jù)規(guī)范添加你想要的元素。

需要我們注意的是，頁面中必須加載css文件https://mipcache.bdstatic.com/static/mipmain-v0.0.1.css 和 js文件https://mipcache.bdstatic.com/static/mipmain-v0.0.1.js，其中v0.0.1是版本號，功能升級之后版本號也會改變，開發(fā)中可以根據(jù)文檔中的說明進行加載。

第二步：引入圖片

html標簽中圖片的標簽是<img>，而百度MIP HTML中圖片標簽使用的是組件<mip-img>

第三步：改變頁面的樣式

使用MIP HTML 時，頁面樣式是可以根據(jù)自己的需求自定義的，具體方法如下：

（1）改變樣式

MIP HTML 是web頁面，頁面中任何元素的樣式都可以通過普通的css屬性來設計。使用時，在頁面的head部分引入css樣式，在css中，可以通過類或者元素選擇器進行選擇要修改樣式的dom元素。例如：

<style mip-custom>

   /* any custom style goes here */

   body {

       background-color: white;

   }

   mip-img {

       background-color: gray;

       border: 1px solid black;

   }

</style>

需要我們注意的是，每個MIP HTML頁面只能嵌入一個css樣式，且<style> 標簽需要標記自定義樣式，即寫成 <style mip-custo>。

（2）控件的布局

出于對性能的考慮，MIP頁面暫時不支持第三方通過css來元素進行布局。

第四步：預覽和驗證

為了確保所開發(fā)的mip頁面是有效的，在頁面開發(fā)過程中校驗規(guī)則是需要非常嚴格的。

開發(fā)完成之后需要預覽，預覽的方式可以按照普通的HTML站點預覽方式，有以下兩種方式可以選擇：

（1）直接在瀏覽器中打開（由于XML Http Requests失敗可能會導致某些元素預覽失?。?

（2）在本地部署一個服務，如apache，nginx等

在開發(fā)過程中細節(jié)方面出現(xiàn)小差錯是難免的，可以通過以下方式進行mip頁面的驗證：

1） 在瀏覽器中打開頁面

2）打開控制臺， 驗證錯誤

到了這一步就算是完成了頁面的本地測試，而且錯誤也被修復了，也就是說你的第一個MIP頁面已經(jīng)準備好了。

河南億恩科技股份有限公司(1tcdy.com)始創(chuàng)于2000年，專注服務器托管租用，是國家工信部認定的綜合電信服務運營商。億恩為近五十萬的用戶提供服務器托管、服務器租用、機柜租用、云服務器、網(wǎng)站建設、網(wǎng)站托管等網(wǎng)絡基礎服務，另有網(wǎng)總管、名片俠網(wǎng)絡推廣服務，使得客戶不斷的獲得更大的收益。
服務器/云主機 24小時售后服務電話：0371-60135900
虛擬主機/智能建站 24小時售后服務電話：0371-55621053
網(wǎng)絡版權侵權舉報電話：0371-60135995
服務熱線：0371-60135900