非固定宽高百分比布局设置宽高比纯CSS

最近遇到个小问题一直不知道怎么解决,就是如何在百分比布局中高度用宽度的百分比.即:<div class='demo'></div> .demo{ width: 100%; height: auto; } 这种时候height是根据本身高度自动调整的,那么如何做到height和width成比呢?接下来就要介绍下百分比布局的一些细节了:所谓的padding-bottom:100%中百分比是按宽度来算的而不是高度,故可以借此来实现百分比布局宽高成比例.如下:<div class='demo'></div> .demo{ width: 100%; padding-bottom: 100%; }

在线生成背景笔画图

演示地址:点我前往 GitHub: 点我前往 交流QQ群:826352486(极简影院的交流群,懒得再建群了)本项目实现了如下功能:1.canvas画图 2.canvas转化为png 3.canva生成图片并保存到本地 4.响应式布局 5.canvas导入自定义字体 6.canvas清晰度解决其他的就不足为提了,如果有类似项目需要用到的可见index.js小结这一次并未使用任何外部库,全部是原生js,努力实现不依赖于库编程。所以可能很多地方不符合规范,还望指正

在线井字棋

在线井字棋使用Vue和Websocket做的一个小项目做完了这个也没有太理解socket的原理个人发现了些问题:websocket不能直接判断用户是否直接关闭了浏览器,需要用心跳包确定用户状态使用Node搭建服务端的话 端口号会冲突 可是百度却告诉我TCP不会冲突?演示地址:点我Github:点我