随笔分类 -  less

div遮罩层
摘要：<template> <div> <div class="img_div"> <img src="https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=1844712564,539435280&fm=26&gp=0.jpg"> <a hr 阅读全文
posted @ 2020-07-17 16:04 青竹玉简 阅读(264) 评论(0) 推荐(0)
CSS实现垂直居中的常用方法
摘要：在前端开发过程中，盒子居中是常常用到的。其中 ，居中又可以分为水平居中和垂直居中。水平居中是比较容易的，直接设置元素的margin: 0 auto就可以实现。但是垂直居中相对来说是比较复杂一些的。下面我们一起来讨论一下实现垂直居中的方法。 首先，定义一个需要垂直居中的div元素，他的宽度和高度均为3 阅读全文
posted @ 2020-07-13 11:06 青竹玉简 阅读(338) 评论(0) 推荐(0)
css中inline-block出现下移的情况
摘要：在包裹层里嵌套的两个div设置display: inline-block时，正常情况下两个div会并排显示，如图 代码： html: <div id="box"> <div class="content1"></div> <div class="content2"></div> </div> css 阅读全文
posted @ 2020-07-02 14:27 青竹玉简 阅读(2480) 评论(1) 推荐(2)
div中元素float之后不能自动撑大，添加css样式
摘要：.clearfix:after { content: "."; display: block; height: 0; clear: both; overflow:hidden; visibility: hidden;} 阅读全文
posted @ 2020-06-30 10:13 青竹玉简 阅读(213) 评论(0) 推荐(0)
VScoed Vue settings.json配置
摘要：加载组件 1.安装eslint依赖在package.json中用npm安装eslint的依赖 "eslint": "^4.19.1", "eslint-friendly-formatter": "^4.0.1", "eslint-loader": "^2.0.0", "eslint-plugin-h 阅读全文
posted @ 2020-05-18 11:23 青竹玉简 阅读(2619) 评论(0) 推荐(0)
CSS3实现鼠标移动到图片上图片变大（缓慢变大，有过渡效果，放大的过程是有动画过渡的，这个过渡的时间可以自定义）
摘要：其中： transition: all 0.6s; 表示所有的属性变化在0.6s的时间段内完成。 transform: scale(1.4); 表示在鼠标放到图片上的时候图片按比例放大1.4倍。 阅读全文
posted @ 2019-08-05 15:57 青竹玉简 阅读(2364) 评论(0) 推荐(0)
less的引用及公共变量的抽离
摘要：一、什么是less？ less是什么自然不用多言，乃一个css预编译器，可以扩展css语言，添加功能如如允许变量(variables),混合(mixins),函数(functions) 和许多其他的技术，让你的Css更具维护性，主题性，扩展性。 官网：http://lesscss.org/usage 阅读全文
posted @ 2019-07-24 13:20 青竹玉简 阅读(5640) 评论(1) 推荐(0)