Windy_Z的博客

使用方法：使用 backdrop-filter : blur()配合background : rgba()来实现弹窗的毛玻璃效果。优点：这种方式省去了多设置一个after伪类来进行背景模糊的麻烦而且backdrop-filter : blur()是自动把该元素后面的背景进行模糊处理，而不需要指定固定的背景来进行模糊Demo代码：WXML 页面：<view class='bg_contain'> <view class='blur_demo'></view&

1. 响应式布局简介响应式布局是指通过判断设备类型、或设备的屏幕宽度来呈现不同的显示效果。比如一个网页，在电脑端和手机端的显示是不一样的。2. 媒体设备类型常见的媒体设备类型有：screen、print等在<style>或<link>中加入 media="print" / media="screen" 来指定样式应用的媒体类型3. 简化如果每个不同的样式...

1. grid布局简介与对比简介：grid采用网格布局方案，把一块区域划分为多个网格，然后分别用元素去填充这些网格。与flex布局对比：整体布局理念与flex有点类似，但grid布局在实现固定区域布局的时候显得更灵活更易用。flex布局是基于弹性盒子模型，让元素按先后顺序塞进大盒子里，可以说是简化的float布局。grid布局则是类似于表格，用一个大网格来划分出若干个小网格，元...

Animation的学习1. Animation基本用法<!--由@keyframes来定义新的animation动作-->@keyframes animation1{ 0%{ transform:translate(100px,200px); } 100%{ transform:translate(0px,0px); }}@keyframes anima...

前言这篇博客是我的CSS学习笔记1. float布局知识点：1. 设置浮动：float：none/left/right2. 设置float布局将脱离文档流，不会占据页面的空间3. 浮动元素的外边缘不会超过父元素的内边缘3. 浮动元素不会相互重叠4. 浮动元素只能左右浮动5. 浮动元素的display属性将完全失效并可以设置宽高，不会独占一行6. 清除浮动：clear:bot...

Canvas的使用1. 创建<canvas>创建<canvas>元素并声明width、height和<canvas width="600" height="400"></canvas>2. JS中获取组件1. JS获取组件//querySelector返回值类型为静态NodeList集合，是克隆整个对象，所以速度慢var mycan...