> 看板娘是一種職業(yè)和習慣稱呼,也是ACGN次文化中的萌屬性之一。簡而言之就是小店的女服務(wù)生,也有“吸引顧客,招攬生意,提高人氣”等作用類似品牌形象代言人的含義。 #### 1. 訪問巨佬網(wǎng)站,下載壓縮包 --- [https://www.jsdelivr.com/package/npm/live2d-widget](https://www.jsdelivr.com/package/npm/live2d-widget) ![](https://img.itqaq.com/art/content/b7c7e5f81d73bf1fa29a1ebb52645f76.png) #### 2. 解壓壓縮包,復制 `lib` 目錄下的四個文件 --- ![](https://img.itqaq.com/art/content/79ade26c5f3aa0c36171c477be335a16.png) #### 3. 引入 兩個js 文件,加一句css代碼 --- ```html <!DOCTYPE html> <html> <head> <title>live2d 看板娘</title> <meta name="viewport" content="width=device-width, initial-scale=1"> <style> #live2dcanvas { border: 0 !important; } </style> <script src="js/L2Dwidget.0.min.js"></script> <script src="js/L2Dwidget.min.js"></script> </head> <body> <script> /* 這個script就寫在html里面,千萬不要把它加入引用文件, 因為它需要等頁面渲染完畢再執(zhí)行,不然可愛的看板娘不會出來哦 */ L2Dwidget.init({ display: { superSample: 2, width: 150, height: 400, position: "left", hOffset: 0, vOffset: 0, }, }); </script> </body> </html> ``` #### 4. 效果如下圖 --- ![](https://img.itqaq.com/art/content/64c2d8c850fac3c7724db8363de9e183.png) #### 5. 下載 `看板娘壓縮包` 和 `本文示例源碼` --- 鏈接: https://pan.baidu.com/s/1HlRCRtMKBk8Hoe4C2RKkQA 提取碼: `kh52`