css中的&
发表于|更新于
|浏览量:
要在座的人都停止了说话的时候,有了机会,方才可以谦逊地把问题提出,向人学习。—— 约翰·洛克
今天看到一种css写法:
1 | /deep/ .message-list { |
/deep/我们之前博客提过了,嵌套写法很简单,今天聊聊&这个父选择器
sass中文文档提到了这个父选择器
上方的&-text其实就表示.message-item-text
1 | .message-item { |
编译后为:
1 | .message-item { |
相关推荐
2022-04-06
react hook 生命周期
诚实的生活方式其实是按照自己身体的意愿行事,饿的时候才吃饭,爱的时候不必撒谎。——马尔克斯《霍乱时期的爱情》 官方文档:https://zh-hans.reactjs.org/docs/hooks-reference.html#conditionally-firing-an-effect 直接上代码: 123456789101112131415161718192021222324252627282930313233343536373839404142'use strict';function LikeButton() { const [liked, setLiked] = React.useState(false) const [count, setCount] = React.useState(0) React.useEffect(() => { // 只执行一次 setInterval(() => setCount(state => ++state), 1000) ...
2023-09-05
docusaurus
伟大变为可笑只有一步,但再走一步,可笑又会变为伟大。——佩思 https://docusaurus.io/ docusaurus可以快速构建文档、博客等站点,非常方便好用 apache-streampark就用的这个构建的官网
2024-11-13
uniapp-cli工程
人生苦短,虽说如此,还会感到无聊。——佚名 除了HBuilderX可视化界面,也可以使用 cli 脚手架,可以通过 vue-cli 创建 uni-app 项目。 #环境安装全局安装 vue-cli 1npm install -g @vue/cli 复制代码 #创建uni-app 使用正式版(对应HBuilderX最新正式版) 1vue create -p dcloudio/uni-preset-vue my-project 复制代码 使用alpha版(对应HBuilderX最新alpha版) 1vue create -p dcloudio/uni-preset-vue#alpha my-alpha-project 复制代码 使用Vue3/Vite版 创建以 javascript 开发的工程(如命令行创建失败,请直接访问 gitee 下载模板) 1npx degit dcloudio/uni-preset-vue#vite my-vue3-project 复制代码 1npx degit dcloudio/uni-preset-vue#vite-alpha...
2020-06-30
jQuery的ajax
今天公司实习生问我jQuery的ajax怎么写,这玩意不是很简单吗 12345678910111213$.ajax({ url: "/cowBeer", //url method: "post", //请求方式 contentType: "application/json", //参数类型 data: JSON.stringify({ //这里面是参数 "name":"cowBeer" }), success: function (res) { console.log(res); //处理返回的数据 }, error: function (res) { //错误处...
2022-12-31
unocss
忍把浮名,换了浅斟低唱。——柳永《鹤冲天》 分享一个css框架unocss 可以通过class规则,生成对应样式,例如通过m-1生成margin: 0.25rem 而且规则可以通过 https://uno.antfu.me/ 进行查询 除了预制规则,还可以自定义规则: 123rules: [ ['m-1', { margin: '0.25rem' }],] 即可生成 1.m-1 { margin: 0.25rem; } 还可以通过正则的方式 1234rules: [ [/^m-(\d+)$/, ([, d]) => ({ margin: `${d / 4}rem` })], [/^p-(\d+)$/, match => ({ padding: `${match[1] / 4}rem` })],] 使用起来 123456<div class="m-100"> &...
2022-08-21
webpack
细砂般数不尽的星,有颗向我眨眼睛。——芥川龙之介《侏儒的话》 摘自芥川龙之介的《侏儒的话》。 首先是官方文档:https://webpack.docschina.org/ 本质上,webpack 是一个用于现代 JavaScript 应用程序的 静态模块打包工具。当 webpack 处理应用程序时,它会在内部从一个或多个入口点构建一个 依赖图(dependency graph),然后将你项目中所需的每一个模块组合成一个或多个 bundles,它们均为静态资源,用于展示你的内容。 接下来我们跟着快速上手一下,将一个普通的html文件使用webpack改造 https://webpack.docschina.org/guides/getting-started 创建目录,安装依赖 1234mkdir webpack-democd webpack-demonpm init -ynpm install webpack webpack-cli --save-dev 新建index.html 1234567891011<!DOCTYPE html><html&...

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