css中的&
发表于|更新于
|浏览量:
要在座的人都停止了说话的时候,有了机会,方才可以谦逊地把问题提出,向人学习。—— 约翰·洛克
今天看到一种css写法:
1 | /deep/ .message-list { |
/deep/我们之前博客提过了,嵌套写法很简单,今天聊聊&这个父选择器
sass中文文档提到了这个父选择器
上方的&-text其实就表示.message-item-text
1 | .message-item { |
编译后为:
1 | .message-item { |
相关推荐
2023-04-14
js文件名排序
处人不可任己意,要悉人之情;处事不可任己见,要悉事之理。——吕坤 分享一个今天写的简单的文件名排序 12345678910111213141516171819202122232425262728293031323334353637383940function fileNameCompare(a, b) { if (a == null || b == null) return 0; let na = a.split(/[-_.—, (]/) let nb = b.split(/[-_.—, (]/) let maxLoop = Math.max(na.length, nb.length) for (let i = 0; i < maxLoop; i++) { if (!isNaN(Number(na[i])) && !isNaN(Number(nb[i]))) { let num = Number(na[i]) - Number(nb[i]) ...
2024-01-02
调试js事件小技巧
万人都要将火熄灭,我一人独将此火高高举起。——海子 分享一个js调试事件小技巧 123456789<!DOCTYPE html><html><head> <title>Event Monitor Trigger</title></head><body> <button id="myButton">Click Me</button></body></html> 这里一个按钮,啥都没有 我们运行一下,给它在chrome console里添加事监听 12// 先用选中元素光标选一下按钮,这样$0就会指向按钮monitorEvents($0) 这时候我们触发其任何事件都会有输出 针对某一事件的话就传入该事件 1monitorEvents($0, ["click"])
2021-11-02
vue父组件调用子组件方法
抱怨身处黑暗,不如提灯前行。——刘同 首先是官方文档 这里使用ref属性去访问子元素 1<hello-world ref="helloWorld" msg="Hello World"></hello-world> 然后打印一下 1console.log(this.$refs.helloWorld); 可以看到成功获取到 再到子组件定义一个方法: 父组件访问: 效果:
2023-01-22
一个js视差动画
人生碌碌,竞短论长,却不道荣枯有数,得失难量。——《浮生六记》 分享一个js视差动画:https://codepen.io/isladjan/details/abdyPBw 滑动会出现各种动画效果,非常的好玩
2025-02-11
expo
谁终将声震人间,必长久深自缄默;谁终将点燃闪电,必长久如云漂泊。——尼采 https://docs.expo.dev/https://github.com/expo/expo Expo 是一个开源平台,旨在帮助开发者构建可以在 Android、iOS 和 Web 上运行的通用原生应用。通过结合使用 React 和 JavaScript,开发者可以在一个统一的环境中构建跨平台的应用,而不需要切换不同的技术栈。Expo 的核心优势之一就是它提供了一个完整的 SDK、模块 API、CLI 工具以及丰富的文档,极大简化了跨平台开发过程。 Expo 不仅支持快速开发,还通过其独特的功能和服务帮助开发者将应用构建、发布和迭代过程变得更加高效。例如,Expo 应用服务 (EAS) 提供了一套集成的服务平台,能够帮助开发者在个人或团队环境中更轻松地管理和发布应用。 Expo 生态Expo 提供了一个强大的生态系统,包括多个模块和工具,使得从开发到部署的每一步都能得到充分的支持。除了基础的功能开发之外,Expo 还包含了与 EAS 深度集成的服务,帮助用户自动化构建、分发和发布应用。这意味着你...
2024-12-01
skew
醉过才知酒浓,爱过才知情重。你不能做我的诗,正如我不能做你的梦。——胡适 https://developer.mozilla.org/zh-CN/docs/Web/CSS/transform-function/skew CSS中的skew()函数:打造斜切效果在前端开发中,CSS transform属性为我们提供了强大的工具来操控元素的外观,而skew()函数正是其中一种常用的变换方式。本文将带你详细了解skew()的原理、用法以及它如何为你的网页增添设计灵感。 什么是skew()?skew()是一种 2D 变换函数,用于对元素进行斜切变换。简单来说,它会将元素沿着 X 轴或 Y 轴方向倾斜一定的角度,创造出一种动态的透视效果。它的应用场景广泛,包括按钮动画、卡片设计和图形变换等。 语法1transform: skew(ax, ay); ax:沿 X 轴的倾斜角度(可选,默认值为 0)。 ay:沿 Y 轴的倾斜角度(可选,默认值为 0)。 单位为角度(deg),也可以使用弧度(rad)或其他角度单位。 用法示例1. 基本应用 以下示例将一个矩形沿 X 轴倾斜 20...

阿超
我的名字叫阿超 年龄25岁 家在北京市 职业是软件开发 每天最晚也会在八点前回家 不抽烟 酒浅尝辄止 晚上十二点上床 保证睡足八个小时 睡前写一篇博客 再做二十分钟俯卧撑暖身 然后再睡觉 基本能熟睡到天亮 像婴儿一样不留下任何疲劳和压力 就这样迎来第二天的早晨 健康检查结果也显示我很正常 我想说明我是一个不论何时都追求内心平稳的人 不拘泥于胜负 不纠结于烦恼 不树立使我夜不能寐的敌人 这就是我在这社会的生活态度
Follow Me公告
This is my Blog