书架
✨

书架

=一个知识书库=

:class数组写法
41 字1 分钟

:class数组写法

<!--more--> ```markup <div :class="[ activeTag, activeCss, { 'red-btn': isPosition} ]"> ``` ```javascript computed: { activeTag() { return this.fullState == 3 ? 'yellow-btn' : 'gray-btn' }, activeCss() { return this.audience ? 'yel
技术设计,前端,css
more...
CSS @media 属性
602 字3 分钟

CSS @media 属性

# 媒体查询两种方法: ## css方式 ```scss @media screen and (max-width: 600px) { /*当屏幕尺寸小于600px时，应用下面的CSS样式*/ .class { background: #ccc; } } /*当屏幕尺寸大于900px时，应用下面的CSS样式*/ @media screen and (min-width: 900px) { .class { background: #fff; } } ``` <!--more--> 注意下顺序，如果你把@media (m
技术设计,前端,css
more...
CSS keyframes
1235 字5 分钟

CSS keyframes

> [Keyframe 演示动画](http://www.lixianglong.cn/html/heyframe/) <!--more--> # 语法 `keyframe` 动画的实现原理跟 `flash` 的实现方式类似，在 CSS 块之间进行关键帧的属性的更新。下面定义一个 `keyframe` 动画，将元素的水平位置从 `-100%` 平滑地渐变到`0%`： ```scss @keyframes slide-in { from { transform: translateX(-100%); } to {
技术设计,前端,css
more...
vue transition 属性
1046 字4 分钟

vue transition 属性

> **常用属性：** > > 1. **name:** string，用于自动生成 CSS 过渡类名。例如：name: 'fade' 将自动拓展为 .fade-enter，.fade-enter-active 等。默认类名为 "v" > 2. **appear:** boolean，是否在初始渲染时使用过渡。默认为 false。 > 3. **css:** boolean，是否使用 CSS 过渡类。默认为 true。如果设置为 false，将只通过组件事件触发注册的 JavaScript 钩子。 > 4. **type:** string，指定过渡事件类型，侦听过渡何时结束。有效值
技术设计,前端,css
more...
CSS transform 属性
898 字3 分钟

CSS transform 属性

> transform 属性向元素应用 2D 或 3D 转换。该属性允许我们对元素进行**旋转rotate**、**扭曲skew**、**缩放scale**和**移动translate**以及**矩阵变形matrix。** **语法:** ```scss transform: none|transform-functions; /*即：*/ transform: rotate | scale | skew | translate |matrix; ``` <!--more--> ### 一、旋转 rotate #### **1、rotate(angle)：
技术设计,前端,css
more...