MIP完整DEMO

2018-10-10 16:56 更新

一個(gè)完整的例子

<!DOCTYPE html>
<html mip>
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
        <link rel="stylesheet" type="text/css"  rel="external nofollow" target="_blank" >
        <link rel="canonical"  rel="external nofollow" target="_blank" >
        <title>Hello World</title>
        <style mip-custom>
            body{margin:10px;}
            .red-text { color: red;}
            .middle-text { text-align: center;}
            .small-pic { max-width: 200px;}
        </style>
    </head>
    <body>
        <!--自定義樣式-->
        <p class="red-text">MIP頁支持修改css樣式</p>
        <p class="middle-text">我是居中的文字</p>
        <hr>
        <!--圖片組件-->
        <p class="middle-text">&lt;mip-img&gt; 圖片組件</p>
        <div class="small-pic">
            <mip-img src="https://www.mipengine.org/static/img/mip_logo_3b722d7.png" rel="external nofollow" >
                <p>圖片說明文字</p>
            </mip-img>
        </div>
        <hr>
        <!--分享組件-->
        <p class="middle-text">&lt;mip-share&gt; 分享組件</p>
        <mip-share title="分享:我的第一個(gè)MIP頁面"></mip-share>
        <hr>
        <!--分享組件-->
        <p class="middle-text">&lt;mip-stats-bidu&gt; 百度統(tǒng)計(jì)組件,代碼可見</p>
        <mip-stats-bidu token="4e397f684261b9e4ff9d8"></mip-stats-bidu>
        <!--mip 運(yùn)行環(huán)境-->
        <script src="https://mipcache.bdstatic.com/static/mipmain-v1.1.2.js" rel="external nofollow" ></script>
        <!--分享組件 代碼-->
        <script src="https://mipcache.bdstatic.com/static/v1.1/mip-share.js" rel="external nofollow" ></script>
        <!--百度統(tǒng)計(jì)組件 代碼-->
        <script src="https://mipcache.bdstatic.com/static/v1.1/mip-stats-bidu.js" rel="external nofollow" ></script>
    </body>
</html>


以上內(nèi)容是否對您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號
微信公眾號

編程獅公眾號