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

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

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

需要我們注意的是，頁(yè)面中必須加載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是版本號(hào)，功能升級(jí)之后版本號(hào)也會(huì)改變，開發(fā)中可以根據(jù)文檔中的說(shuō)明進(jìn)行加載。

第二步：引入圖片

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

第三步：改變頁(yè)面的樣式

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

（1）改變樣式

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

<style mip-custom>

   /* any custom style goes here */

   body {

       background-color: white;

   }

   mip-img {

       background-color: gray;

       border: 1px solid black;

   }

</style>

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

（2）控件的布局

出于對(duì)性能的考慮，MIP頁(yè)面暫時(shí)不支持第三方通過css來(lái)元素進(jìn)行布局。

第四步：預(yù)覽和驗(yàn)證

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

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

（1）直接在瀏覽器中打開（由于XML Http Requests失敗可能會(huì)導(dǎo)致某些元素預(yù)覽失?。?

（2）在本地部署一個(gè)服務(wù)，如apache，nginx等

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

1） 在瀏覽器中打開頁(yè)面

2）打開控制臺(tái)， 驗(yàn)證錯(cuò)誤

到了這一步就算是完成了頁(yè)面的本地測(cè)試，而且錯(cuò)誤也被修復(fù)了，也就是說(shuō)你的第一個(gè)MIP頁(yè)面已經(jīng)準(zhǔn)備好了。

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