是否可以使用php glob函数匹配任意数量的数字?我正在尝试匹配图像缩略图的文件名,最终尺寸从2到4位.
我知道我可以提供一个数字范围,但这只匹配一个字符:
glob("thumbname-[0-9]-[0-9].jpg")
Run Code Online (Sandbox Code Playgroud)
这将匹配thumbname-1-1.jpg但不匹配thumbname-10-10.jpg等.
当将输出从一个输出到另一个时,是否可以使用node-sass和postcss autoprefixer生成完全可用的源图?我目前在package.json中有以下内容:
"scripts": {
"sass": "node-sass sass/app.scss --source-map true --source-map-embed true",
"postcss:autoprefixer": "postcss --use autoprefixer -b 'last 2 versions' --map",
"css": "npm run sass -s | npm run postcss:autoprefixer -s > css/app.css"
}
Run Code Online (Sandbox Code Playgroud)
这会产生一个半工作的内联源图,但是原始文件的链接不正确,因此在Chrome devtools中点击它们将不会加载它们(看起来它们被处理为相对链接,然后从css文件夹中引用).我尝试通过向--source-map-contents truenode-sass 添加选项来修复此问题,但随后autoprefixer错误,我怀疑因为它不喜欢dataUri的行长度.
理想情况下,我更喜欢输出一个单独的.map文件,但设置node-sass选项--source-map css/app.css.map不会写出任何东西,大概是因为只有css输出到stdout.
我想设置一个 CSS 布局,其中容器包含固定数量的具有以下属性的灵活宽度图块:
也许纯 CSS 是不可能的,但感觉应该可以!下面有一个最小的例子,我将在这里详细说明:
https://jsfiddle.net/vztskh6f/1/
这似乎是最好的选择,因为我们总是希望图块宽度保持一致。为了使列换行,我相信您需要使用repeat()语法,并且repeat(auto-fit, ...)似乎最适合此用例。显而易见的解决方案似乎是使用repeat(auto-fit, minmax(100px, 200px)). 然而,这不起作用,200px无论容器的宽度如何,瓷砖总是保持在原处。在所有其他方面,这都按预期运行:
.gridContainer {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(100px, 200px));
padding: 10px;
gap: 10px;
justify-items: center;
justify-content: center;
}
.child {
width: 100%;
height: 30px;
background: #0f0;
text-align: center;
}
Run Code Online (Sandbox Code Playgroud)
可以使用选项 1 来强制执行所需的规范,方法是使用grid-template-columns: repeat(auto-fit, minmax(100px, 1fr))然后在容器上设置计算值max-width并强制其居中,但感觉单独使用 CSS Grid 应该可以实现这一点?
使用 Flexbox 实现包裹要简单得多,并且flex在子项上使用意味着我们可以轻松设置具有最小和最大宽度的灵活图块。然而,一旦子元素换行到第二行,它显然会扩展到其最大宽度,并且与其他图块不一致:
.flexContainer …Run Code Online (Sandbox Code Playgroud) 假设我有以下代码:
class Foo {
constructor() {
this.a = 1;
this.b = 'something';
}
someMethod() {
// Is this legal?
let { a, b } = this;
}
}
Run Code Online (Sandbox Code Playgroud)
销毁工作someMethod合法吗?
我的直觉是,这很好,但是我在任何文档中都没有提到这种用法。它目前可在Babel中使用,但大概是因为Babel在后台将类转换为函数。我的理解是(几乎)JS中的所有东西都原型地继承自Object,因此我可能希望对Classes和Class实例也是如此。
我所见的关于引擎盖下发生的情况的唯一参考是在此处,它指定JS引擎调用内部方法ToObject,该方法仅在遇到nullor 时才会抛出TypeError undefined。但是ToObject文档没有明确提及类实例。
autoprefixer ×1
css ×1
css-grid ×1
ecmascript-6 ×1
flexbox ×1
glob ×1
javascript ×1
node-sass ×1
npm ×1
npm-scripts ×1
php ×1
postcss ×1