微信小程序用什么语言开发

微信小程序用以下语言开发：

一、HTML语言

html是超文本标识语言的缩写，html它是网页开发的前端之一，主肆毁要负责网页的框架，就像动物的框架一样，html语言也是支持网页布局的框架。

二、CSS

css，前三剑客之二是分层风格表。主冶网页风格、网页如何遍布、版块背景、色彩等外观问题都会出现CSS控制。

三、JavaScript

简称js，前三剑客，是一种动态脚含饥本语言。js只是一种Web随着脚本语言的交互，Googlev8模块，angular，react等待前端框架越来越分离前端和后端，以及node.js等技术的发展，js也开始在服务端焕发出惊人的活力，成为目前非常活跃的语言之一。

四、服务器语言

如果没有专业的后端开发人员，后端可能很难学习曲线。但建议开发人员学习后端语言，至少要了解后端框架的基本原理和代码逻辑，这样不仅可以完成前端和后端的合作，还可以发生在小程序中bug时扯皮用。

服务端语言有很多常用的技术，比如PHP，ava，Python，ASP，建议开发人员根据公司内部使用的技术选择学裂老备习。

五、数据库语言

如果公司信息量小，结构不复杂，数据库语言相对简单，一般可以通过学习一些常用的指令和常见的问题来处理。经常使用的数据库是免费的MySQL，msSQL，MongoDB，Oracle等等。

rem由来 ：font size of the root element，那么rem是个单位，单位大小由它第一代老祖宗的 font-size 的大小决定。现在前端码农们为了能在各个屏幕上看到一个健康的网页在默默的牺牲贺肢着自己的健康，因为不仅要知道rem是个单位，更重要的是要知道怎么能在不同分辨率下呈现的页面都很NB。

事故造成原因：

1.px单位在PC上很流行，在手机屏幕上一看，MLGB的，同样的12px却小的跟蚂蚁似的。

2.好不容易在iPhone4上调的正常了，换个菊花牌手机，MBD不堪入目了。

3.知道了rem的用法，但是html的font-size到底是多少才合适啊啊啊，妈蛋~。

好了，那么现在来解决这些问题。

在解决之前，麻烦各位大婶要了解一些你可能不想了解的东东（警告：不了解这些就不能知道真相哟~）：

1. 物理像素(physical pixel)

我们看到的每个屏幕都是由一颗颗我们肉眼难以看到的小颗粒（物理像素）组成的。

2.逻辑像素

是基棚计算机坐标系统中的一个点，这个点代表一个可以由程序使用的虚拟像素(比如说CSS像素)。

3.设备的像素比(device pixel ratio)简称DPR

它的数值体现了物理像素和逻辑像素之间的关系，用公式可以计算出该设备的DPR的大小：

DPR= 物理像素 / 逻辑像素

那么了解了上面这些概念，就可以知道，为什么css在pc上写着font-size=12px但是换到手机上却变小了？因为DPR啊啊啊，大哥~。

没错，我们在电脑屏幕上的DPR是1，但是手机却不同，可能是它可能是2，也可能是3。获取设备DPR的方法还是有的：

1.在JavaScript中，通过window.devicePixelRatio来获取

2.在css中，可以通过-webkit-device-pixel-ratio，-webkit-min-device-pixel-ratio和 -webkit-max-device-pixel-ratio进行媒体查询，对不同DPR的设备，做搏拍则一些样式适配(这里只针对webkit内核的浏览器和webview)。

本人也在网上看了不少动态设置rem的文章，下面把几个常用的列举出来：

一，用媒体查询来设置html的font-size：

@mediascreen and (min-width:320px) {html{font-size:14px}} @mediascreen and (min-width:360px) {html{font-size:16px}} @mediascreen and (min-width:400px) {html{font-size:18px}} @mediascreen and (min-width:440px) {html{font-size:20px}} @mediascreen and (min-width:480px) {html{font-size:22px}} @mediascreen and (min-width:640px) {html{font-size:28px}}

二、利用js来动态设置

!(function(doc, win){vardocEle = doc.documentElement,        evt ="onorientationchange"inwindow?"orientationchange":"resize",        fn =function(){varwidth = docEle.clientWidth            width &&(docEle.style.fontSize =20* (width /320) +"px")        }        win.addEventListener(evt, fn,false)    doc.addEventListener("DOMContentLoaded", fn,false)}(document,window))

我要说的是最后一种，也是我认为目前比较好的实现方法：

利用js计算当前设备的DPR，动态设置在html标签上，并动态设置html的font-size，利用css的选择器根据DPR来设置不同DPR下的字体大小（这个方法很不错哦~）

!function(win, lib){vartimer,        doc    = win.document,        docElem = doc.documentElement,        vpMeta  = doc.querySelector('meta[name="viewport"]'),        flexMeta = doc.querySelector('meta[name="flexible"]'),        dpr  =0,        scale =0,        flexible = lib.flexible || (lib.flexible = {})// 设置了 viewport metaif(vpMeta) {console.warn("将根据已有的meta标签来设置缩放比例")varinitial = vpMeta.getAttribute("content").match(/initial\-scale=([\d\.]+)/)if(initial) {            scale =parseFloat(initial[1])// 已设置的 initialScaledpr =parseInt(1/ scale)// 设备像素比 devicePixelRatio}    }// 设置了 flexible Metaelseif(flexMeta) {varflexMetaContent = flexMeta.getAttribute("content")if(flexMetaContent) {varinitial = flexMetaContent.match(/initial\-dpr=([\d\.]+)/),                maximum = flexMetaContent.match(/maximum\-dpr=([\d\.]+)/)if(initial) {                dpr =parseFloat(initial[1])                scale =parseFloat((1/ dpr).toFixed(2))            }if(maximum) {                dpr =parseFloat(maximum[1])                scale =parseFloat((1/ dpr).toFixed(2))            }        }    }// viewport 或 flexible// meta 均未设置if(!dpr &&!scale) {// QST// 这里的 第一句有什么用 ?// 和 Android 有毛关系 ?varu = (win.navigator.appVersion.match(/android/gi), win.navigator.appVersion.match(/iphone/gi)),            _dpr = win.devicePixelRatio// 所以这里似乎是将所有 Android 设备都设置为 1 了dpr = u ? ( (_dpr >=3&&(!dpr || dpr >=3))                        ?3: (_dpr >=2&&(!dpr || dpr >=2))                            ?2:1)                :1        scale =1/ dpr    }    docElem.setAttribute("data-dpr", dpr)// 插入 viewport metaif(!vpMeta) {        vpMeta = doc.createElement("meta")                vpMeta.setAttribute("name","viewport")        vpMeta.setAttribute("content","initial-scale="+ scale +", maximum-scale="+ scale +", minimum-scale="+ scale +", user-scalable=no")if(docElem.firstElementChild) {            docElem.firstElementChild.appendChild(vpMeta)        }else{vardiv = doc.createElement("div")            div.appendChild(vpMeta)            doc.write(div.innerHTML)        }    }functionsetFontSize(){varwinWidth = docElem.getBoundingClientRect().widthif(winWidth / dpr >540) {            (winWidth =540* dpr)        }// 根节点 fontSize 根据宽度决定varbaseSize = winWidth /10        docElem.style.fontSize = baseSize +"px"        flexible.rem = win.rem = baseSize    }// 调整窗口时重置win.addEventListener("resize",function(){        clearTimeout(timer)        timer = setTimeout(setFontSize,300)    },false)// 这一段是我自己加的// orientationchange 时也需要重算下吧win.addEventListener("orientationchange",function(){        clearTimeout(timer)        timer = setTimeout(setFontSize,300)    },false)// pageshow// keyword: 倒退 缓存相关win.addEventListener("pageshow",function(e){if(e.persisted) {            clearTimeout(timer)            timer = setTimeout(setFontSize,300)        }    },false)// 设置基准字体if("complete"=== doc.readyState) {        doc.body.style.fontSize =12* dpr +"px"    }else{        doc.addEventListener("DOMContentLoaded",function(){            doc.body.style.fontSize =12* dpr +"px"        },false)    }      setFontSize()    flexible.dpr = win.dpr = dpr    flexible.refreshRem = setFontSize    flexible.rem2px =function(d){varc =parseFloat(d) *this.remif("string"==typeofd &&d.match(/rem$/)) {            c +="px"        }returnc    }    flexible.px2rem =function(d){varc =parseFloat(d) /this.remif("string"==typeofd &&d.match(/px$/)) {            c +="rem"        }returnc    }}(window,window.lib || (window.lib = {}))

忘了说了，手机淘宝很多页面用的就是这种方法来适配终端的。

小族咐程序的页面不支持html标签和css样式。根据查询相关资料信息显示，微信小程序棚粗相比WebAPP也有不兆和纯足，不支持HTML标签和DOM *** 作，对CSS的支持也有限，前端库和框架也无法使用。

---