方法一、在结尾处添加空div标签clear:both在浮动的盒子之下再放一个标签，在这个标签中使用clear:both，来清除浮动对页面的影响.注意：一般情况下不会使用这一种方式来清除浮动。因为这种清除浮动的方式会增加页面的标签，造成结构的混乱.<divclass="box"><divclass="red">1</div><divclass="sienna
分类：
Web程序 时间：
2019-11-05 09:34:34
阅读次数：
101
像px、rem、em、%这样的长度单位大家肯定都很熟悉，前者为绝对单位，后者为相对单位。CSS3又引入了新单位：vw、vh、vmin、vmax。下面对它们做个详细介绍。单位作用特性px页面按精确像素展示绝对单位rem相对根节点html字体大小来计算相对单位em基准点为相对父节点字体的大小相对单位%相对于父元素的大小设定的比率相对单位vw视窗宽度的百分比，1vw代表视窗宽度的1%视窗单位vh视窗高度
分类：
Web程序 时间：
2019-11-05 09:21:05
阅读次数：
115
我们想提高网页性能的最有影响力的措施之一，就是以不延迟网页渲染的方式加载CSS。在默认情况下，浏览器在加载CSS时将终止页面的样式呈现（同步加载），也就是加载CSS会阻塞DOM树的渲染（但并不会阻塞DOM树的构建），可以简单理解为：当在加载CSS的同时，也在构建DOM树，只是没有应用上样式。渲染流程简单过一遍浏览器渲染的流程：加载HTML资源解析HTML加载CSS资源，同时构建DOM树解析CSS，
分类：
Web程序 时间：
2019-11-05 09:20:26
阅读次数：
110
前段时间在开发中，遇到需要给背景层加颜色遮罩的项目，现在特定总结一下给背景图层加颜色遮罩的方法。方法一：通过定位叠加(注意层级)<divclass="wrap1"><divclass="inner"></div></div>.wrap1{position:relative;width:1200px;height:400px;background:rg
分类：
Web程序 时间：
2019-11-05 09:19:03
阅读次数：
132
效果图原理表单元素中，有一个pattern属性，可以自定义正则表达式（如手机号、邮箱、.）；valid伪类，可以匹配通过pattern验证的元素；invalid伪类则相反，可以匹配未通过pattern验证的元素；于是就可以随便搞啦，上面的效果图只是做一些简单的效果，更多效果以及限制大家就发挥自己的想象力咯；html布局很简单，input跟button是兄弟节点的关系，required属性是
分类：
Web程序 时间：
2019-11-03 22:14:36
阅读次数：
134
马上就2020年了，不知道小伙伴们今年学习了css3动画了吗？说起来css动画是一个很尬的事，一方面因为公司用css动画比较少，另一方面大部分开发者习惯了用JavaScript来做动画，所以就导致了许多程序员比较排斥来学习css动画（至少我是），但是一个不懂css动画的前端工程师不能称之为掌握css3，其实当你真正学习css动画之后，你会被它的魅力所吸引的，它可以减少代码量、提高性能。上一篇文章我
分类：
Web程序 时间：
2019-11-03 22:12:07
阅读次数：
131
我们传统的前端更多的是用javascript实现各种复杂动画，自从有了Css3transition和animation以来,前端开发在动画这一块有了更高的自由度和格局,对动画的开发也越来越容易。这篇文章就让我们汇总一下使用Css3实现的各种特效。1.实现内部虚线边框知识点：outline核心代码.dash-border{width:200px;height:100px;line-height:10
分类：
Web程序 时间：
2019-11-03 22:08:30
阅读次数：
124
经过最近两年多的发展，小程序的地位也逐渐越来越高了，各个平台前赴后继做了自家的小程序平台，随着市场的需求越来愈多，uni-app是一个使用Vue.js开发所有前端应用的框架，开发者编写一套代码，可发布到iOS、Android、H5、以及各种小程序（微信/支付宝/百度/头条/QQ/钉钉）等多个平台。即使不跨端，uni-app同时也是更好的小程序开发框架。效果图1、获取位置信息在定位功能中，本程序用到
分类：
微信 时间：
2019-11-03 21:52:31
阅读次数：
135
模拟拼多多动画效果，最终效果图如下：我们看一下实现过程。主框架是vue开发，做成了一个动画组件，因为涉及到多个页面引用，最主要的实现是css3语法实现过程，并且要做到循环播放。左边出来动画时间是0.5秒，停留3秒往上走，然后动画时间0.5秒，停留3秒后然后消失，消失动画时间0.5秒，总共的时间消耗是7.5秒。可以得到以下计算比例如果大家对编程，web前端感兴趣，想要学习，打算深入了解这个行业的朋友
分类：
Web程序 时间：
2019-11-03 21:49:48
阅读次数：
134
1，效果图2，源码HTML<body><divclass=“container”><divid=“mask”></div><divid=“sky”></div><divid=“moon”></div><divid=“stars”></div><divclass=“cloud
分类：
Web程序 时间：
2019-11-03 10:55:20
阅读次数：
150
