12 2021 档案

vue的transition标签配合animate.css与vivify.css使用的方式
摘要：vue版本：v.2.5.2 <transition name="fade-box"> <div v-show="show" class="box"></div> </transition>.box { width: 200px; height: 200px; background-color: pi 阅读全文
posted @ 2021-12-29 16:36 yw3692582 阅读(171) 评论(0) 推荐(0)
element的menu折叠隐藏效果
摘要：<template> <div class="main"> <div class="left_main" :class="{ left_main_show: openStatus }"> <el-menu id="elmenu" background-color="#545c64" text-col 阅读全文
posted @ 2021-12-29 10:16 yw3692582 阅读(1936) 评论(0) 推荐(0)
Vue可伸缩工具栏
摘要：<template> <div class="main"> <div class="toolbar" :class="{ toolbar_show: !openStatus }"> <el-button type="primary" size="small">点击</el-button> <el-b 阅读全文
posted @ 2021-12-28 17:22 yw3692582 阅读(613) 评论(0) 推荐(0)
Vue实现左侧可伸缩
摘要：<template> <div class="main"> <div class="left_main" :class="{ left_main_show: !openStatus }"></div> <div class="right_main"> <div class="open_close"> 阅读全文
posted @ 2021-12-28 17:07 yw3692582 阅读(692) 评论(0) 推荐(0)
移动端web开发理想视口及normalize.css
摘要：<meta name="viewport" content="width=device-width,user-scalable=no, initial-scale=1.0，maximum-scale=1.0，minimum-scale=1.0"> 阅读全文
posted @ 2021-12-27 20:33 yw3692582 阅读(54) 评论(0) 推荐(0)
3D旋转
摘要：<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="wi 阅读全文
posted @ 2021-12-27 20:11 yw3692582 阅读(29) 评论(0) 推荐(0)
css实现图片放大效果
摘要：<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="wi 阅读全文
posted @ 2021-12-26 23:08 yw3692582 阅读(601) 评论(0) 推荐(0)
css的transform移动、旋转、缩放动画
摘要：<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="wi 阅读全文
posted @ 2021-12-26 23:00 yw3692582 阅读(501) 评论(0) 推荐(0)
css伸缩栏
摘要：<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="wi 阅读全文
posted @ 2021-12-26 22:45 yw3692582 阅读(31) 评论(0) 推荐(0)
css的transition过渡效果
摘要：<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="wi 阅读全文
posted @ 2021-12-26 22:17 yw3692582 阅读(52) 评论(0) 推荐(0)
css三角形
摘要：<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="wi 阅读全文
posted @ 2021-12-26 21:59 yw3692582 阅读(41) 评论(0) 推荐(0)
css三角形升级（秒杀效果）
摘要：<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="wi 阅读全文
posted @ 2021-12-26 21:50 yw3692582 阅读(55) 评论(0) 推荐(0)
css一行显示不下用省略号
摘要：<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="wi 阅读全文
posted @ 2021-12-26 21:13 yw3692582 阅读(416) 评论(0) 推荐(0)
css三角形效果
摘要：<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="wi 阅读全文
posted @ 2021-12-26 21:00 yw3692582 阅读(38) 评论(0) 推荐(0)
css清除浮动
摘要：<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="wi 阅读全文
posted @ 2021-12-26 20:32 yw3692582 阅读(34) 评论(0) 推荐(0)
element和vant的按需引入
摘要：.babelrc文件 { "presets": [ [ "env", { "modules": false, "targets": { "browsers": [ "> 1%", "last 2 versions", "not ie <= 8" ] } } ], "stage-2" ], "plug 阅读全文
posted @ 2021-12-24 16:32 yw3692582 阅读(107) 评论(0) 推荐(0)