将值从ESP8266实时发送到网页 #包括 #包括 #包括 #包括 #包括 #定义MAX_SRV_客户端2 const char*ssid=“**********”； const char*password=“*************”；软件序列mySerial（15,13）//接收和发送字节消息[]={0X10、0X03、0X01、0X27、0X00、0X01、0X36、0XBC}； int y=543； ESP8266Web服务器（80）； WiFiServer服务器1（80）； WiFiClient服务器客户端[最大SRV客户端]；常数int led=13； const char index_html[]PROGMEM={“\n\n\n\n\n\n\n\n@import网址(https://fonts.googleapis.com/css?family=Dosis:200，400500600）；\nhtml，主体{高度：100%；宽度：100%；溢出：隐藏；}\n主体{背景：#F2F2F2F2F2；背景颜色：浅蓝色；}\n\n{width:300px；margin:10px auto 0；text align:center；padding top:30px；padding left:5%；}\n.de.den、.de.dene、.de.denem、.de.deneme{position:absolute；left:50%；top:50%；}\n.de{\n位置：相对；\n宽度：240px；\n高度：240px；\n边框半径：100%；\n方框阴影：0 10px rgba（0,0,0,1）；\n背景颜色：透明；\n}\n.den{\n位置：相对；\n宽度：210px；\n高度：210px；\n边距：-105px 0-105px；\n边框半径：100%；\n方框阴影：插入0 2px 10px rgba（0,0,0,5），0 2px 20px rgba（255,255,1）；\n背景：#df3341；\n背景：-moz线性渐变（左，#df3341 0%，#d4f355 50%，#61c0ec 100%）\n背景：-webkit渐变（线性，左上，右上，颜色停止（0%，#df3341），颜色停止（50%，#d4f355），颜色停止（100%，#61c0ec））\n背景：-webkit线性渐变（左，#df3341 0%，#D4550%，35F35550%，35C0EC100%）\n背景：线性渐变（右，35C050%，#D4EC 100%。\n背景：；\n位置：相对；\n}\n.dene{\n宽度：180px；\n高度：180px；\n边距：-90px 0-90px；\n边框半径：100%；\n方框阴影：插入0 2px 2px rgba（255，255，255，4），0 3px 13px rgba（0，0，0，85）；\n背景：#f2f6f5；\n背景：-moz线性渐变（顶部，#f2f6f5 0%，cbd6 100%）；\n背景：-webkit渐变（线性，左上，左下，颜色停止（0%，#f2f6f5），颜色停止（100%，#cbd5d6））；\n背景：-webkit线性渐变（顶部，#f2f6f5 0%，#cbd5d6 100%）；\n背景：-o-线性渐变（顶部，#f2f6f5 0%，#CBD6 100%）；\n}\n{\n宽度：160px；\n高度：160px；\n边距：-80px 0-80px；\n边框半径：100%；\n背景：#cbd5d6；\n背景：-moz线性渐变（顶部，#cbd5d6 0%，#f2f6f5 100%）\n背景：-网络工具包渐变（线性，左上，左下，颜色停止（0%，#cbd5d6），颜色停止（100%，#f2f6f5））；\n背景：-webkit线性渐变（顶部，#cbd5d6 0%，#f2f6f5 100%）；\n}\n\n.deneme{\n填充：3px 10px 0 10px；\n宽度：120px；\n高度：137px；\n显示：内联块；\n边距：-70px 0-70px；\n颜色：#555；\n文本阴影：1px 1px 1px白色；\n字体系列：'Dosis'；\n字体大小：100px；\n字体重量：400；\n文本对齐：中心；\n}\n\n\n字体大小：30px；字体重量：200；}\n、 deneme strong{position:绝对；right:10px；top:25px；font size:34px；}\n\ninput[type=\“number\”]{\n-webkit外观：textfield；\n-moz外观：textfield；\n外观：textfield；\n}\n\ninput[type=number]：-webkit内部旋转按钮，\ninput[type=number]：-webkit外部旋转按钮{\n-webkit外观：无；\n}\n{\n\n位置：绝对；\n边距：20px 30px 20px；\n\n}\n.number-input{\n\n边距：自动；\n边框：2px固体#ddd；\n显示：内联flex；\n}\n\n.number-input；\n.number-input*{\n框大小：边框框；\n}\n\n\n.number-input按钮{\n大纲：无；\n-webkit外观：无；\n背景色：透明；\n边框：无；\n对齐项目：中心；\n对齐内容：中心；\n宽度：3rem；\n高度：3rem；\n光标：指针；\n边距：0；\n位置：相对；\n}\n\n.number-input按钮：前，\n.number-input按钮：后{\n显示：内联块；\n位置：绝对；\n内容：'.\n宽度：1rem；\n高度：2px；\n背景色：#212121；\n变换：变换（-50%，-50%）；\n}\n.number-input按钮。加上：{\n变换后：变换（-50%，-50%）旋转（90度）；\n}\n\n\n\n.number-input输入[type=number]{\n字体系列：无衬线；\n最大宽度：5rem；\n填充：.5rem；\n边框：实心#ddd；\n边框宽度：0 2px；\n字体大小：2rem；\n高度：3rem；\n字体重量：粗体；\n文本对齐：中心；\n}\n\n\n\nh1{\n字母间距：3px；\n文本对齐：中心；\n文本转换：大写；\n颜色：4CAF50；\n}\n\n\n{\n\n文本对齐：居中；\n字母间距：3px；\n}\n\n{\n文本装饰：无；\n颜色：008CBA；\n}\n\n\n\n\nLWEB服务器\n_Html_C++_Ajax_Arduino_Esp8266

html/
将值从ESP8266实时发送到网页 #包括 #包括 #包括 #包括 #包括 #定义MAX_SRV_客户端2 const char*ssid=“**********”； const char*password=“*************”；软件序列mySerial（15,13）//接收和发送字节消息[]={0X10、0X03、0X01、0X27、0X00、0X01、0X36、0XBC}； int y=543； ESP8266Web服务器（80）； WiFiServer服务器1（80）； WiFiClient服务器客户端[最大SRV客户端]；常数int led=13； const char index_html[]PROGMEM={“\n\n\n\n\n\n\n\n@import网址(https://fonts.googleapis.com/css?family=Dosis:200，400500600）；\nhtml，主体{高度：100%；宽度：100%；溢出：隐藏；}\n主体{背景：#F2F2F2F2F2；背景颜色：浅蓝色；}\n\n{width:300px；margin:10px auto 0；text align:center；padding top:30px；padding left:5%；}\n.de.den、.de.dene、.de.denem、.de.deneme{position:absolute；left:50%；top:50%；}\n.de{\n位置：相对；\n宽度：240px；\n高度：240px；\n边框半径：100%；\n方框阴影：0 10px rgba（0,0,0,1）；\n背景颜色：透明；\n}\n.den{\n位置：相对；\n宽度：210px；\n高度：210px；\n边距：-105px 0-105px；\n边框半径：100%；\n方框阴影：插入0 2px 10px rgba（0,0,0,5），0 2px 20px rgba（255,255,1）；\n背景：#df3341；\n背景：-moz线性渐变（左，#df3341 0%，#d4f355 50%，#61c0ec 100%）\n背景：-webkit渐变（线性，左上，右上，颜色停止（0%，#df3341），颜色停止（50%，#d4f355），颜色停止（100%，#61c0ec））\n背景：-webkit线性渐变（左，#df3341 0%，#D4550%，35F35550%，35C0EC100%）\n背景：线性渐变（右，35C050%，#D4EC 100%。\n背景：；\n位置：相对；\n}\n.dene{\n宽度：180px；\n高度：180px；\n边距：-90px 0-90px；\n边框半径：100%；\n方框阴影：插入0 2px 2px rgba（255，255，255，4），0 3px 13px rgba（0，0，0，85）；\n背景：#f2f6f5；\n背景：-moz线性渐变（顶部，#f2f6f5 0%，cbd6 100%）；\n背景：-webkit渐变（线性，左上，左下，颜色停止（0%，#f2f6f5），颜色停止（100%，#cbd5d6））；\n背景：-webkit线性渐变（顶部，#f2f6f5 0%，#cbd5d6 100%）；\n背景：-o-线性渐变（顶部，#f2f6f5 0%，#CBD6 100%）；\n}\n{\n宽度：160px；\n高度：160px；\n边距：-80px 0-80px；\n边框半径：100%；\n背景：#cbd5d6；\n背景：-moz线性渐变（顶部，#cbd5d6 0%，#f2f6f5 100%）\n背景：-网络工具包渐变（线性，左上，左下，颜色停止（0%，#cbd5d6），颜色停止（100%，#f2f6f5））；\n背景：-webkit线性渐变（顶部，#cbd5d6 0%，#f2f6f5 100%）；\n}\n\n.deneme{\n填充：3px 10px 0 10px；\n宽度：120px；\n高度：137px；\n显示：内联块；\n边距：-70px 0-70px；\n颜色：#555；\n文本阴影：1px 1px 1px白色；\n字体系列：'Dosis'；\n字体大小：100px；\n字体重量：400；\n文本对齐：中心；\n}\n\n\n字体大小：30px；字体重量：200；}\n、 deneme strong{position:绝对；right:10px；top:25px；font size:34px；}\n\ninput[type=\“number\”]{\n-webkit外观：textfield；\n-moz外观：textfield；\n外观：textfield；\n}\n\ninput[type=number]：-webkit内部旋转按钮，\ninput[type=number]：-webkit外部旋转按钮{\n-webkit外观：无；\n}\n{\n\n位置：绝对；\n边距：20px 30px 20px；\n\n}\n.number-input{\n\n边距：自动；\n边框：2px固体#ddd；\n显示：内联flex；\n}\n\n.number-input；\n.number-input*{\n框大小：边框框；\n}\n\n\n.number-input按钮{\n大纲：无；\n-webkit外观：无；\n背景色：透明；\n边框：无；\n对齐项目：中心；\n对齐内容：中心；\n宽度：3rem；\n高度：3rem；\n光标：指针；\n边距：0；\n位置：相对；\n}\n\n.number-input按钮：前，\n.number-input按钮：后{\n显示：内联块；\n位置：绝对；\n内容：'.\n宽度：1rem；\n高度：2px；\n背景色：#212121；\n变换：变换（-50%，-50%）；\n}\n.number-input按钮。加上：{\n变换后：变换（-50%，-50%）旋转（90度）；\n}\n\n\n\n.number-input输入[type=number]{\n字体系列：无衬线；\n最大宽度：5rem；\n填充：.5rem；\n边框：实心#ddd；\n边框宽度：0 2px；\n字体大小：2rem；\n高度：3rem；\n字体重量：粗体；\n文本对齐：中心；\n}\n\n\n\nh1{\n字母间距：3px；\n文本对齐：中心；\n文本转换：大写；\n颜色：4CAF50；\n}\n\n\n{\n\n文本对齐：居中；\n字母间距：3px；\n}\n\n{\n文本装饰：无；\n颜色：008CBA；\n}\n\n\n\n\nLWEB服务器\n

将值从ESP8266实时发送到网页 #包括 #包括 #包括 #包括 #包括 #定义MAX_SRV_客户端2 const char*ssid=“**********”； const char*password=“*************”；软件序列mySerial（15,13）//接收和发送字节消息[]={0X10、0X03、0X01、0X27、0X00、0X01、0X36、0XBC}； int y=543； ESP8266Web服务器（80）； WiFiServer服务器1（80）； WiFiClient服务器客户端[最大SRV客户端]；常数int led=13； const char index_html[]PROGMEM={“\n\n\n\n\n\n\n\n@import网址(https://fonts.googleapis.com/css?family=Dosis:200，400500600）；\nhtml，主体{高度：100%；宽度：100%；溢出：隐藏；}\n主体{背景：#F2F2F2F2F2；背景颜色：浅蓝色；}\n\n{width:300px；margin:10px auto 0；text align:center；padding top:30px；padding left:5%；}\n.de.den、.de.dene、.de.denem、.de.deneme{position:absolute；left:50%；top:50%；}\n.de{\n位置：相对；\n宽度：240px；\n高度：240px；\n边框半径：100%；\n方框阴影：0 10px rgba（0,0,0,1）；\n背景颜色：透明；\n}\n.den{\n位置：相对；\n宽度：210px；\n高度：210px；\n边距：-105px 0-105px；\n边框半径：100%；\n方框阴影：插入0 2px 10px rgba（0,0,0,5），0 2px 20px rgba（255,255,1）；\n背景：#df3341；\n背景：-moz线性渐变（左，#df3341 0%，#d4f355 50%，#61c0ec 100%）\n背景：-webkit渐变（线性，左上，右上，颜色停止（0%，#df3341），颜色停止（50%，#d4f355），颜色停止（100%，#61c0ec））\n背景：-webkit线性渐变（左，#df3341 0%，#D4550%，35F35550%，35C0EC100%）\n背景：线性渐变（右，35C050%，#D4EC 100%。\n背景：；\n位置：相对；\n}\n.dene{\n宽度：180px；\n高度：180px；\n边距：-90px 0-90px；\n边框半径：100%；\n方框阴影：插入0 2px 2px rgba（255，255，255，4），0 3px 13px rgba（0，0，0，85）；\n背景：#f2f6f5；\n背景：-moz线性渐变（顶部，#f2f6f5 0%，cbd6 100%）；\n背景：-webkit渐变（线性，左上，左下，颜色停止（0%，#f2f6f5），颜色停止（100%，#cbd5d6））；\n背景：-webkit线性渐变（顶部，#f2f6f5 0%，#cbd5d6 100%）；\n背景：-o-线性渐变（顶部，#f2f6f5 0%，#CBD6 100%）；\n}\n{\n宽度：160px；\n高度：160px；\n边距：-80px 0-80px；\n边框半径：100%；\n背景：#cbd5d6；\n背景：-moz线性渐变（顶部，#cbd5d6 0%，#f2f6f5 100%）\n背景：-网络工具包渐变（线性，左上，左下，颜色停止（0%，#cbd5d6），颜色停止（100%，#f2f6f5））；\n背景：-webkit线性渐变（顶部，#cbd5d6 0%，#f2f6f5 100%）；\n}\n\n.deneme{\n填充：3px 10px 0 10px；\n宽度：120px；\n高度：137px；\n显示：内联块；\n边距：-70px 0-70px；\n颜色：#555；\n文本阴影：1px 1px 1px白色；\n字体系列：'Dosis'；\n字体大小：100px；\n字体重量：400；\n文本对齐：中心；\n}\n\n\n字体大小：30px；字体重量：200；}\n、 deneme strong{position:绝对；right:10px；top:25px；font size:34px；}\n\ninput[type=\“number\”]{\n-webkit外观：textfield；\n-moz外观：textfield；\n外观：textfield；\n}\n\ninput[type=number]：-webkit内部旋转按钮，\ninput[type=number]：-webkit外部旋转按钮{\n-webkit外观：无；\n}\n{\n\n位置：绝对；\n边距：20px 30px 20px；\n\n}\n.number-input{\n\n边距：自动；\n边框：2px固体#ddd；\n显示：内联flex；\n}\n\n.number-input；\n.number-input*{\n框大小：边框框；\n}\n\n\n.number-input按钮{\n大纲：无；\n-webkit外观：无；\n背景色：透明；\n边框：无；\n对齐项目：中心；\n对齐内容：中心；\n宽度：3rem；\n高度：3rem；\n光标：指针；\n边距：0；\n位置：相对；\n}\n\n.number-input按钮：前，\n.number-input按钮：后{\n显示：内联块；\n位置：绝对；\n内容：'.\n宽度：1rem；\n高度：2px；\n背景色：#212121；\n变换：变换（-50%，-50%）；\n}\n.number-input按钮。加上：{\n变换后：变换（-50%，-50%）旋转（90度）；\n}\n\n\n\n.number-input输入[type=number]{\n字体系列：无衬线；\n最大宽度：5rem；\n填充：.5rem；\n边框：实心#ddd；\n边框宽度：0 2px；\n字体大小：2rem；\n高度：3rem；\n字体重量：粗体；\n文本对齐：中心；\n}\n\n\n\nh1{\n字母间距：3px；\n文本对齐：中心；\n文本转换：大写；\n颜色：4CAF50；\n}\n\n\n{\n\n文本对齐：居中；\n字母间距：3px；\n}\n\n{\n文本装饰：无；\n颜色：008CBA；\n}\n\n\n\n\nLWEB服务器\n

html c++ ajax arduino

将值从ESP8266实时发送到网页 #包括 #包括 #包括 #包括 #包括 #定义MAX_SRV_客户端2 const char*ssid=“**********”； const char*password=“*************”；软件序列mySerial（15,13）//接收和发送字节消息[]={0X10、0X03、0X01、0X27、0X00、0X01、0X36、0XBC}； int y=543； ESP8266Web服务器（80）； WiFiServer服务器1（80）； WiFiClient服务器客户端[最大SRV客户端]；常数int led=13； const char index_html[]PROGMEM={“\n\n\n\n\n\n\n\n@import网址(https://fonts.googleapis.com/css?family=Dosis:200，400500600）；\nhtml，主体{高度：100%；宽度：100%；溢出：隐藏；}\n主体{背景：#F2F2F2F2F2；背景颜色：浅蓝色；}\n\n{width:300px；margin:10px auto 0；text align:center；padding top:30px；padding left:5%；}\n.de.den、.de.dene、.de.denem、.de.deneme{position:absolute；left:50%；top:50%；}\n.de{\n位置：相对；\n宽度：240px；\n高度：240px；\n边框半径：100%；\n方框阴影：0 10px rgba（0,0,0,1）；\n背景颜色：透明；\n}\n.den{\n位置：相对；\n宽度：210px；\n高度：210px；\n边距：-105px 0-105px；\n边框半径：100%；\n方框阴影：插入0 2px 10px rgba（0,0,0,5），0 2px 20px rgba（255,255,1）；\n背景：#df3341；\n背景：-moz线性渐变（左，#df3341 0%，#d4f355 50%，#61c0ec 100%）\n背景：-webkit渐变（线性，左上，右上，颜色停止（0%，#df3341），颜色停止（50%，#d4f355），颜色停止（100%，#61c0ec））\n背景：-webkit线性渐变（左，#df3341 0%，#D4550%，35F35550%，35C0EC100%）\n背景：线性渐变（右，35C050%，#D4EC 100%。\n背景：；\n位置：相对；\n}\n.dene{\n宽度：180px；\n高度：180px；\n边距：-90px 0-90px；\n边框半径：100%；\n方框阴影：插入0 2px 2px rgba（255，255，255，4），0 3px 13px rgba（0，0，0，85）；\n背景：#f2f6f5；\n背景：-moz线性渐变（顶部，#f2f6f5 0%，cbd6 100%）；\n背景：-webkit渐变（线性，左上，左下，颜色停止（0%，#f2f6f5），颜色停止（100%，#cbd5d6））；\n背景：-webkit线性渐变（顶部，#f2f6f5 0%，#cbd5d6 100%）；\n背景：-o-线性渐变（顶部，#f2f6f5 0%，#CBD6 100%）；\n}\n{\n宽度：160px；\n高度：160px；\n边距：-80px 0-80px；\n边框半径：100%；\n背景：#cbd5d6；\n背景：-moz线性渐变（顶部，#cbd5d6 0%，#f2f6f5 100%）\n背景：-网络工具包渐变（线性，左上，左下，颜色停止（0%，#cbd5d6），颜色停止（100%，#f2f6f5））；\n背景：-webkit线性渐变（顶部，#cbd5d6 0%，#f2f6f5 100%）；\n}\n\n.deneme{\n填充：3px 10px 0 10px；\n宽度：120px；\n高度：137px；\n显示：内联块；\n边距：-70px 0-70px；\n颜色：#555；\n文本阴影：1px 1px 1px白色；\n字体系列：'Dosis'；\n字体大小：100px；\n字体重量：400；\n文本对齐：中心；\n}\n\n\n字体大小：30px；字体重量：200；}\n、 deneme strong{position:绝对；right:10px；top:25px；font size:34px；}\n\ninput[type=\“number\”]{\n-webkit外观：textfield；\n-moz外观：textfield；\n外观：textfield；\n}\n\ninput[type=number]：-webkit内部旋转按钮，\ninput[type=number]：-webkit外部旋转按钮{\n-webkit外观：无；\n}\n{\n\n位置：绝对；\n边距：20px 30px 20px；\n\n}\n.number-input{\n\n边距：自动；\n边框：2px固体#ddd；\n显示：内联flex；\n}\n\n.number-input；\n.number-input*{\n框大小：边框框；\n}\n\n\n.number-input按钮{\n大纲：无；\n-webkit外观：无；\n背景色：透明；\n边框：无；\n对齐项目：中心；\n对齐内容：中心；\n宽度：3rem；\n高度：3rem；\n光标：指针；\n边距：0；\n位置：相对；\n}\n\n.number-input按钮：前，\n.number-input按钮：后{\n显示：内联块；\n位置：绝对；\n内容：'.\n宽度：1rem；\n高度：2px；\n背景色：#212121；\n变换：变换（-50%，-50%）；\n}\n.number-input按钮。加上：{\n变换后：变换（-50%，-50%）旋转（90度）；\n}\n\n\n\n.number-input输入[type=number]{\n字体系列：无衬线；\n最大宽度：5rem；\n填充：.5rem；\n边框：实心#ddd；\n边框宽度：0 2px；\n字体大小：2rem；\n高度：3rem；\n字体重量：粗体；\n文本对齐：中心；\n}\n\n\n\nh1{\n字母间距：3px；\n文本对齐：中心；\n文本转换：大写；\n颜色：4CAF50；\n}\n\n\n{\n\n文本对齐：居中；\n字母间距：3px；\n}\n\n{\n文本装饰：无；\n颜色：008CBA；\n}\n\n\n\n\nLWEB服务器\n,html,c++,ajax,arduino,esp8266,Html,C++,Ajax,Arduino,Esp8266,ESP 8266测试\n\n\n\n\n\n\n.°；\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n“}；整型整数=y/10；整数小数=y%10； void handleRoot（）{ 数码写入（led，1）； send_P（200，“text/HTML”，index_HTML）；数字写入（led，0）； } void handleNotFound（）{ 数码写入（led，1）； String message=“找不到文件\n\n”；消息+=“URI:”； messa

ESP 8266测试\n

\n\n\n\n\n\n.°；\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n“}；整型整数=y/10；整数小数=y%10； void handleRoot（）{ 数码写入（led，1）； send_P（200，“text/HTML”，index_HTML）；数字写入（led，0）； } void handleNotFound（）{ 数码写入（led，1）； String message=“找不到文件\n\n”；消息+=“URI:”； message+=server.uri（）；消息+=“\n方法：”； message+=（server.method（）==HTTP\u GET）？“GET”：“POST”；消息+=“\n消息：”； message+=server.args（）；消息+=“\n”；对于（uint8_t i=0；i 0）{ mySerial.write（message，sizeof（message））；延迟（3000）； } 对于（i=0；i°；

#include <ESP8266WiFi.h>
#include <WiFiClient.h>
#include <ESP8266WebServer.h>
#include <ESP8266mDNS.h>
#include <SoftwareSerial.h>

#define MAX_SRV_CLIENTS 2

const char* ssid = "********";
const char* password = "**********";

SoftwareSerial mySerial (15, 13); //RX TX
byte message[] = {0X10, 0X03, 0X01, 0X27, 0X00, 0X01, 0X36, 0XBC};
int y = 543;

ESP8266WebServer server(80);
WiFiServer server1(80);
WiFiClient serverClients[MAX_SRV_CLIENTS];


const int led = 13;

const char index_html[] PROGMEM = {"<!DOCTYPE html>\n\n\n<html>\n<?php\n    $whole = $_GET['whole'];\n    $decimal = $_GET['decimal'];\n?>\n<body >\n<head><meta name=\"viewport\" content=\"width=device-width\"></head>\n<style media=\"screen\" type=\"text/css\">\n@import url(https://fonts.googleapis.com/css?family=Dosis:200,400,500,600);\nhtml, body { height: 100%; width:100%; overflow: hidden; }\nbody { background: #f2f2f2; background-color: lightblue; }\n\n.container { width: 300px; margin: 10px auto 0; text-align: center; padding-top: 30px; padding-left: 5%; }\n.de .den, .de .dene, .de .denem, .de .deneme { position: absolute;  left: 50%; top: 50%; }\n.de {\n    position: relative;\n    width: 240px;\n    height: 240px;\n    border-radius: 100%;\n    box-shadow: 0 0 10px rgba(0, 0, 0, .1);\n    background-color: transparent;\n}\n.den {\n    position: relative;\n    width: 210px;\n    height: 210px;\n    margin: -105px 0 0 -105px;\n    border-radius: 100%;\n    box-shadow: inset 0 2px 10px rgba(0, 0, 0, .5), 0 2px 20px rgba(255, 255, 255, 1);\n    background: #df3341;\n    background: -moz-linear-gradient(left, #df3341 0%, #d4f355 50%, #61c0ec 100%);\n    background: -webkit-gradient(linear, left top, right top, color-stop(0%,#df3341), color-stop(50%,#d4f355), color-stop(100%,#61c0ec));\n    background: -webkit-linear-gradient(left, #df3341 0%,#d4f355 50%,#61c0ec 100%);\n    background: linear-gradient(to right, #df3341 0%,#d4f355 50%,#61c0ec 100%);\n    position:relative;\n}\n.dene {\n    width: 180px;\n    height: 180px;\n    margin: -90px 0 0 -90px;\n    border-radius: 100%;\n    box-shadow: inset 0 2px 2px rgba(255, 255, 255, .4), 0 3px 13px rgba(0, 0, 0, .85);\n    background: #f2f6f5;\n    background: -moz-linear-gradient(top, #f2f6f5 0%, #cbd5d6 100%);\n    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f2f6f5), color-stop(100%, #cbd5d6));\n    background: -webkit-linear-gradient(top, #f2f6f5 0%, #cbd5d6 100%);\n    background: -o-linear-gradient(top, #f2f6f5 0%, #cbd5d6 100%);\n}\n.denem {\n    width: 160px;\n    height: 160px;\n    margin: -80px 0 0 -80px;\n    border-radius: 100%;\n    background: #cbd5d6;\n    background: -moz-linear-gradient(top, #cbd5d6 0%, #f2f6f5 100%);\n    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #cbd5d6), color-stop(100%, #f2f6f5));\n    background: -webkit-linear-gradient(top, #cbd5d6 0%, #f2f6f5 100%);\n}\n\n.deneme {\n    padding: 3px 10px 0 10px;\n    width: 120px;\n    height: 137px;\n    display: inline-block;\n    margin: -70px 0 0 -70px;\n    color: #555;\n    text-shadow: 1px 1px 1px white;\n    font-family: 'Dosis';\n    font-size: 100px;\n    font-weight: 400;\n    text-align: center;\n}\n.deneme span { font-size: 30px; font-weight: 200; }\n.deneme strong { position: absolute; right: 10px; top: 25px; font-size: 34px; }\n\ninput[type=\"number\"] {\n  -webkit-appearance: textfield;\n  -moz-appearance: textfield;\n  appearance: textfield;\n}\n\ninput[type=number]::-webkit-inner-spin-button,\ninput[type=number]::-webkit-outer-spin-button {\n  -webkit-appearance: none;\n}\n.center {\n     \n    position: absolute;\n    margin: 20px 30px 20px;\n       \n}\n.number-input {\n \n  margin: auto;\n  border: 2px solid #ddd;\n  display: inline-flex;\n}\n\n.number-input,\n.number-input * {\n  box-sizing: border-box;\n}\n\n.number-input button {\n  outline:none;\n  -webkit-appearance: none;\n  background-color: transparent;\n  border: none;\n  align-items: center;\n  justify-content: center;\n  width: 3rem;\n  height: 3rem;\n  cursor: pointer;\n  margin: 0;\n  position: relative;\n}\n\n.number-input button:before,\n.number-input button:after {\n  display: inline-block;\n  position: absolute;\n  content: '';\n  width: 1rem;\n  height: 2px;\n  background-color: #212121;\n  transform: translate(-50%, -50%);\n}\n.number-input button.plus:after {\n  transform: translate(-50%, -50%) rotate(90deg);\n}\n\n.number-input input[type=number] {\n  font-family: sans-serif;\n  max-width: 5rem;\n  padding: .5rem;\n  border: solid #ddd;\n  border-width: 0 2px;\n  font-size: 2rem;\n  height: 3rem;\n  font-weight: bold;\n  text-align: center;\n}\n\n\n\nh1 {\n    letter-spacing: 3px;\n    text-align: center;\n    text-transform: uppercase;\n    color: #4CAF50;\n}\n\np {\n    \n    text-align: center;\n    letter-spacing: 3px;\n}\n\na {\n    text-decoration: none;\n    color: #008CBA;\n}\n\n</style>\n\n<div>\n<h1>LWEB SERVER</h1>\n<p>ESP 8266 Test\n<a target=\"_blank\" href=\"google.com\">\"Web Stranica\"</a> </p>\n</div>\n\n<div class=\"container\">\n    <div class=\"de\">\n        <div class=\"den\">\n          <div class=\"dene\">\n            <div class=\"denem\">\n              <div class=\"deneme\">\n                <?php echo $whole; ?><span>.<?php echo $decimal; ?></span><strong>&deg;</strong>\n              </div>\n            </div>\n          </div>\n        </div>\n    \n</div>\n<div class=\"center\">\n<div class=\"number-input\">\n  <button onclick=\"this.parentNode.querySelector('input[type=number]').stepDown()\" ></button>\n  <input class=\"quantity\" min=\"0\" max=\"8\" name=\"quantity\" value=\"1\" type=\"number\">\n  <button onclick=\"this.parentNode.querySelector('input[type=number]').stepUp()\" class=\"plus\"></button>\n</div></div></div>\n</body>\n</html>\n"};

  int whole = y / 10;
  int decimal = y % 10;

void handleRoot() {
  digitalWrite(led, 1);
  server.send_P(200, "text/HTML", index_html);
  digitalWrite(led, 0);
}

void handleNotFound(){
  digitalWrite(led, 1);
  String message = "File Not Found\n\n";
  message += "URI: ";
  message += server.uri();
  message += "\nMethod: ";
  message += (server.method() == HTTP_GET)?"GET":"POST";
  message += "\nArguments: ";
  message += server.args();
  message += "\n";
  for (uint8_t i=0; i<server.args(); i++){
    message += " " + server.argName(i) + ": " + server.arg(i) + "\n";
  }
  server.send(404, "text/plain", message);
  digitalWrite(led, 0);
}

void setup(void){
  mySerial.begin(9600);
  pinMode(led, OUTPUT);
  digitalWrite(led, 0);
  Serial.begin(115200);
  WiFi.hostname("LCC");
  WiFi.mode(WIFI_STA);
  WiFi.begin(ssid, password);
  Serial.println("");


  // Wait for connection
  while (WiFi.status() != WL_CONNECTED) {
    delay(500);
    Serial.print(".");
  }
  Serial.println("");
  Serial.print("Connected to ");
  Serial.println(ssid);
  Serial.print("IP address: ");
  Serial.println(WiFi.localIP());

  if (MDNS.begin("esp8266")) {
    Serial.println("MDNS responder started");
  }

  server.on("/", handleRoot);

  server.on("/inline", [](){
    server.send(200, "text/plain", "this works as well");
  });

  server.onNotFound(handleNotFound);

  server.begin();
  Serial.println("HTTP server started");
}

void loop(void){
 uint8_t i;
  //check if there are any new clients
  if (server1.hasClient()){
    for(i = 1; i < MAX_SRV_CLIENTS; i++){
      //find free/disconnected spot
      if (!serverClients[i] || !serverClients[i].connected()){
        if(serverClients[i]) serverClients[i].stop();
        serverClients[i] = server1.available();
        Serial.print("New client: "); Serial.print(i);
        break;
      }
    }
    //no free/disconnected spot so reject
    if ( i == MAX_SRV_CLIENTS) {
       WiFiClient serverClient = server1.available();
       serverClient.stop();
        Serial.println("Connection rejected ");
    }
  }
  //check clients for data

  if (i > 0) {
        mySerial.write(message, sizeof(message));
        delay (3000);
        }

        for(i = 0; i < MAX_SRV_CLIENTS; i++){
    if (serverClients[i] && serverClients[i].connected()){
      if(serverClients[i].available()){
        //get data from the telnet client and push it to the UART
        while(serverClients[i].available()) Serial.write(serverClients[i].read());  
      }
    }
  }
  //check UART for data
  if(mySerial.available()){
    size_t len = mySerial.available();
    uint8_t sbuf[len];
    mySerial.readBytes(sbuf, len);
    int16_t x = (sbuf[3] << 8) | sbuf[4];
    //y = (double)x;
    //push UART data to all connected telnet clients
    for(i = 0; i < MAX_SRV_CLIENTS; i++){
      if (serverClients[i] && serverClients[i].connected()){
        serverClients[i].println(x);
        //serverClients[i].write(sbuf, len);
        //Serial.println(x);
        delay(1);
      }
    }
  }


  server.handleClient();
}

    <!DOCTYPE html>


<html>
<?php
    $whole = $_GET['whole'];
    $decimal = $_GET['decimal'];
?>
<body >
<head><meta name="viewport" content="width=device-width"></head>
<style media="screen" type="text/css">
@import url(https://fonts.googleapis.com/css?family=Dosis:200,400,500,600);
html, body { height: 100%; width:100%; overflow: hidden; }
body { background: #f2f2f2; background-color: lightblue; }

.container { width: 300px; margin: 10px auto 0; text-align: center; padding-top: 30px; padding-left: 5%; }
.de .den, .de .dene, .de .denem, .de .deneme { position: absolute;  left: 50%; top: 50%; }
.de {
    position: relative;
    width: 240px;
    height: 240px;
    border-radius: 100%;
    box-shadow: 0 0 10px rgba(0, 0, 0, .1);
    background-color: transparent;
}
.den {
    position: relative;
    width: 210px;
    height: 210px;
    margin: -105px 0 0 -105px;
    border-radius: 100%;
    box-shadow: inset 0 2px 10px rgba(0, 0, 0, .5), 0 2px 20px rgba(255, 255, 255, 1);
    background: #df3341;
    background: -moz-linear-gradient(left, #df3341 0%, #d4f355 50%, #61c0ec 100%);
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,#df3341), color-stop(50%,#d4f355), color-stop(100%,#61c0ec));
    background: -webkit-linear-gradient(left, #df3341 0%,#d4f355 50%,#61c0ec 100%);
    background: linear-gradient(to right, #df3341 0%,#d4f355 50%,#61c0ec 100%);
    position:relative;
}
.dene {
    width: 180px;
    height: 180px;
    margin: -90px 0 0 -90px;
    border-radius: 100%;
    box-shadow: inset 0 2px 2px rgba(255, 255, 255, .4), 0 3px 13px rgba(0, 0, 0, .85);
    background: #f2f6f5;
    background: -moz-linear-gradient(top, #f2f6f5 0%, #cbd5d6 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f2f6f5), color-stop(100%, #cbd5d6));
    background: -webkit-linear-gradient(top, #f2f6f5 0%, #cbd5d6 100%);
    background: -o-linear-gradient(top, #f2f6f5 0%, #cbd5d6 100%);
}
.denem {
    width: 160px;
    height: 160px;
    margin: -80px 0 0 -80px;
    border-radius: 100%;
    background: #cbd5d6;
    background: -moz-linear-gradient(top, #cbd5d6 0%, #f2f6f5 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #cbd5d6), color-stop(100%, #f2f6f5));
    background: -webkit-linear-gradient(top, #cbd5d6 0%, #f2f6f5 100%);
}

.deneme {
    padding: 3px 10px 0 10px;
    width: 120px;
    height: 137px;
    display: inline-block;
    margin: -70px 0 0 -70px;
    color: #555;
    text-shadow: 1px 1px 1px white;
    font-family: 'Dosis';
    font-size: 100px;
    font-weight: 400;
    text-align: center;
}
.deneme span { font-size: 30px; font-weight: 200; }
.deneme strong { position: absolute; right: 10px; top: 25px; font-size: 34px; }

input[type="number"] {
  -webkit-appearance: textfield;
  -moz-appearance: textfield;
  appearance: textfield;
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
}
.center {

    position: absolute;
    margin: 20px 30px 20px;

}
.number-input {

  margin: auto;
  border: 2px solid #ddd;
  display: inline-flex;
}

.number-input,
.number-input * {
  box-sizing: border-box;
}

.number-input button {
  outline:none;
  -webkit-appearance: none;
  background-color: transparent;
  border: none;
  align-items: center;
  justify-content: center;
  width: 3rem;
  height: 3rem;
  cursor: pointer;
  margin: 0;
  position: relative;
}

.number-input button:before,
.number-input button:after {
  display: inline-block;
  position: absolute;
  content: '';
  width: 1rem;
  height: 2px;
  background-color: #212121;
  transform: translate(-50%, -50%);
}
.number-input button.plus:after {
  transform: translate(-50%, -50%) rotate(90deg);
}

.number-input input[type=number] {
  font-family: sans-serif;
  max-width: 5rem;
  padding: .5rem;
  border: solid #ddd;
  border-width: 0 2px;
  font-size: 2rem;
  height: 3rem;
  font-weight: bold;
  text-align: center;
}



h1 {
    letter-spacing: 3px;
    text-align: center;
    text-transform: uppercase;
    color: #4CAF50;
}

p {

    text-align: center;
    letter-spacing: 3px;
}

a {
    text-decoration: none;
    color: #008CBA;
}

</style>

<div>
<h1>LWEB SERVER</h1>
<p>ESP 8266 Test
<a target="_blank" href="google.com">"Web Stranica"</a> </p>
</div>

<div class="container">
    <div class="de">
        <div class="den">
          <div class="dene">
            <div class="denem">
              <div class="deneme">
                <?php echo $whole; ?><span>.<?php echo $decimal; ?></span><strong>&deg;</strong>
              </div>
            </div>
          </div>
        </div>

</div>
<div class="center">
<div class="number-input">
  <button onclick="this.parentNode.querySelector('input[type=number]').stepDown()" ></button>
  <input class="quantity" min="0" max="8" name="quantity" value="1" type="number">
  <button onclick="this.parentNode.querySelector('input[type=number]').stepUp()" class="plus"></button>
</div></div></div>
</body>
</html>

[c++]相关文章推荐

随机文章推荐