2019/07/19 开坑。
在 html 中手动输入多个空格,在页面解析的时候都会变成一个空格,
如果在开头甚至一个空格都不会显示
但就是一定要求在开头/中间显示多个空格,这个问题怎么解决呢?
刚开始接触
Node.js
(包管理项目) 的时候很多人都会疑惑哪些依赖是可以装在全局的,哪些依赖是安装在项目里的,安装在项目里的依赖又是怎么分辨是否是要安装在开发环境中还是生产环境中?
小白的时候还不知道怎么搜索关键词,然后就只能看着文档,他们怎么说自己就怎么敲,
上边写的是 npm install vue
就 npm install
,
如果写的是 npm install -g @vue/cli
那么就 npm install -g
,
如果是 npm install --save-dev @babel/core
那么就 npm install --save-dev
比如 4 个月前的我就是这样,最近有一些人在群里问,那我就整理了下(原来这不是我笨理解不了,别人也是这样觉得的!)
以前只知道 border-radius
有一个圆角半径,今天在做一个半圆的时候突然发现,它还有 x 轴和 y 轴属性。
border-radius
说明:CSS 属性 border-radius 允许你设置元素的外边框圆角。当使用一个半径时确定一个圆形,当使用两个半径时确定一个椭圆。这个(椭)圆与边框的交集形成圆角效果。
该属性是一个 简写属性,是为了将这四个属性 border-top-left-radius、border-top-right-radius、border-bottom-right-radius,和 border-bottom-left-radius 简写为一个属性。
也就是说,每个圆角都有 圆角半径
、 水平半长轴
和 垂直半长轴
属性值:
单行文字的截断非常简单,但多行文字的截断就很麻烦了,
经常要配合 JavaScript 或者 其他语言进行字符串截断,然后拼接上 “…”
突然发现 line-clamp
它可以完成以纯 CSS 的多行文本截断,
并且配合 text-overflow: ellipsis
就可以在尾部加上省略号,
当然 overflow: hidden
并不可缺少
今天,介绍这两个方法的区别以及一些妙用,还有用法相似的 bind 的方法。
它们最主要的作用,是改变 this
的指向。在平时的工作中,除了在写一些基础类,或者公用库方法的时候会用到它们,其他时候应用场景并不多( React
我习惯用箭头函数)。
Meathill:纯 CSS 组件顾名思义,只改变外观,不改变行为。所以它的功能不会因为浏览器变化而变化,即使浏览器支持不完善,即使因为加载速度或者网络关系,导致 CSS、JS 加载失败,它最多样式回归到原始样式,功能是完全一致的。在非标准浏览器环境下,如读屏器,也是如此
前年看肉大直播的时候听到:万能的 :checked + label
当时没有体会到有啥万能,不就是自定义 input
样式吗,直到前段时间看到一个 Demo 虽然不是使用的这种方法,但是我突然就明白了,这个就可以用 :checked + label
来实现。
…
原来很多需要 Js
配合的一些效果点击效果只需要 :checked + label
就可以完成。
yarn add @better-scroll/mouse-wheel@next
import BScroll from '@better-scroll/core'
import MouseWheel from '@better-scroll/mouse-wheel'
BScroll.use(MouseWheel)
new BScroll('.bs-wrap', {
//...
mouseWheel: {
speed: 20,
invert: false,
easeTime: 300
}
})
查看 Demo
源码在 scroll-wrapper
外多了一层 core-mouse-wheel
加上就可以了。
Demo
源码