一、引入模闆 
小程序提供了(le／liǎo)兩個(gè)引入外部模闆的(de)方法：import和(hé / huò)include 
使用外部模闆可以(yǐ)實現大(dà)部分共同頁面的(de)代碼利用，在(zài)一個(gè)app中，頭部和(hé / huò)腳部基本不(bù)會 
變動太大(dà)，這(zhè)時(shí)就(jiù)可以(yǐ)通過模闆的(de)方式引入，實現多個(gè)頁面的(de)複用。

1.1 import

示例：

<!--view.wxml-->
    <template name="view">
        <text>{{text}}</text>
    </template>

引入：

    <import src="view.wxml"/>
    <template is="view" data="{{text: 'forbar'}}"/>

注意：import有作用域，即import引入的(de)模闆隻在(zài)當前頁面有效，即import不(bù)會向下查找另外的(de)模闆

1.2 include

include标簽可以(yǐ)看作是(shì)對 “html”的(de)一個(gè)拷貝，即将外部的(de)wxml片段拷貝進文檔中 
示例： 
外部wxml片段

    <!-- header.wxml -->
    <view> header </view>
    <!-- footer.wxml -->
    <view> footer </view>
    <!-- index.wxml -->
    <include src="header.wxml"/>
    <view> body </view>

總結：import是(shì)引入模闆片段，且有作用域限制，不(bù)能進行模闆嵌套。include是(shì)引入wxml片段，相當于(yú)代碼拷貝。

二、WXSS 微信樣式表 
小程序中，頁面樣式的(de)渲染通過wxss文件實現，.wxss可以(yǐ)看成是(shì)css，因爲(wéi / wèi)它們都在(zài)實現相同的(de)功能。實質上(shàng)wxss也(yě)是(shì)在(zài)css的(de)基礎之(zhī)上(shàng)進行了(le／liǎo)擴充和(hé / huò)修改得到(dào)的(de)。 
wxss在(zài)css上(shàng)的(de)擴展特性： 
1）、尺寸單位：rpx 
rpx：是(shì)一個(gè)相對像素單位，可以(yǐ)根據屏幕寬度進行自适應。 
針對移動端的(de)開發，設計稿一般都是(shì)以(yǐ)iphone6爲(wéi / wèi)标準的(de)。而(ér)iphone用的(de)是(shì)視網膜屏，即我們css中設定的(de)1px，在(zài)iphone上(shàng)實際是(shì)由2px*2px的(de)像素點組成的(de)。 
以(yǐ)iphone6爲(wéi / wèi)準，屏幕寬度375px，共有750個(gè)物理像素，則750rpx=350px,即1rpx=0.5px 
2）、樣式導入 @import 
跟在(zài)css中的(de)外部樣式表的(de)導入類似 
@import "common.wxss";

版權