css
韩大璐
大璐出奇迹~
展开
-
css mixins的用法
mixin是一种简化代码的方法,能够提高代码的重复使用率。使用方法:创建mixins.styl文件,在该文件中封装样式方法在需要使用样式方法的文件中引入mixins.styl文件,直接使用对应方法即可...原创 2020-02-20 18:42:27 · 2103 阅读 · 0 评论 -
stylus定义全局变量
很多项目都会有一个主题色,这个色值在很多地方都会使用到,或者一些在很多地方都会用到的共同的东西,这种情况下最好的办法就是定义一个全局变量,方便使用。最近项目使用stylus写css,也正好有这样的需求,正好把stylus定义变量的方法总结一下。这是项目的头部,背景颜色其实就是整个项目的主题色。为了在其他地方方便使用,需要定义一个全局变量。方法如下:创建一个用来定义全局变量的文件 var...原创 2020-02-20 13:17:22 · 1957 阅读 · 0 评论 -
你不知道的css滤镜技巧
简单来说,CSS 滤镜就是提供类似 PS 的图形特效,像模糊,锐化或元素变色等功能。通常被用于调整图片,背景和边界的渲染。本文就简单介绍几种滤镜的使用。css几种常用的滤镜技巧:使用 filter: blur() 生成毛玻璃效果使用 filter: drop-shadow() 生成整体阴影效果使用 filter: opacity() 生成透明度看下效果:brightness...原创 2018-11-10 16:27:03 · 470 阅读 · 0 评论 -
css获取父元素下第几个元素出坑和JQuery通过index()获取下标出坑方法
这里首先要区分nth-of-type(n)和nth-child(n)的区别:nth-of-type(n) 选择器匹配属于父元素的 特定类型 的第 N 个子元素的每个元素.nth-child(n) 选择器选取父元素的第 N 个子元素, 与类型无关写个demo理解:<div class="container"> <div>div1</...原创 2018-12-28 16:30:36 · 3461 阅读 · 0 评论 -
圆角渐变边框的实现
渐变边框的实现:border:6px solid; border-image: -webkit-linear-gradient( pink,rosybrown) 50 50; border-image: -moz-linear-gradient(pink,rosybrown)50 50; border-image: line...原创 2018-12-28 16:54:20 · 1615 阅读 · 0 评论 -
webstorm编辑器不支持stylus语法解决方案
在设置里添加stylus文件监听如果没有效果的话就需要下载插件下载地址 https://plugins.jetbrains.com/plugin/7316-stylus-support将文件压缩包放在编辑器所在目录的lib目录下即可...原创 2019-01-02 14:42:33 · 2142 阅读 · 0 评论 -
html+css实现加载动画
效果图如上,我不会做动图,啊啊啊,会的小伙伴教我一哈 [手动抱拳]代码很简单,就直接上代码了<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style> body{ width: 100%;...原创 2019-06-20 15:05:08 · 3606 阅读 · 1 评论 -
css3d翻转
<div class="repast-cate-item-content"> <div class="repast-cate-item-main"> <img :src="item.main.imgSrc"> <p>{{item.main.name}}</p> </div> <div clas...原创 2019-07-29 12:36:16 · 644 阅读 · 0 评论