Javascript和css的语法，如何定义'px'？

Question

我有一个非常简单的语法问题，我无法解决。我有以下几行正确的代码。

gridTemplateColumns: '100px 100px 100px',
height: Math.max(65, 200) + 'px',

现在我想在gridTemplateColumns的三个参数中加入Math.max(x,x): '100px 100px 100px 100px。

以下是我试过的，但根本不正确。

gridTemplateColumns: Math.max(100, 50) Math.max(100, 50) Math.max(100, 50)+'px',
gridTemplateColumns: Math.max(100+'px', 50+'px') Math.max(100+'px', 50+'px') Math.max(100+'px', 50+'px'),

我还尝试在这里和那里使用一些花哨的[]和{}，但我没有正确地管理它们.感谢你的帮助。

Answer 1

你可以使用字符串插值的语法

const obj = {
    gridTemplateColumns: `${Math.max(100, 50)}px ${Math.max(100, 50)}px ${Math.max(100, 
    50)}px` 
}

Answer 2

你是如此接近!

跟着

gridTemplateColumns: Math.max(100, 50) + 'px ' + Math.max(100, 50) + 'px ' + Math.max(100, 50) + 'px'

你可能会受益于建立一个函数来实现这个功能。

function maxPx(a,b) {
 return Math.max(a,b) + 'px'
}

但你需要确保不要忘记在值之间加上空格。

gridTemplateColumns: maxPx(100, 50) + ' ' + maxPx(100, 50) + ' ' + maxPx(100, 50)

或者

gridTemplateColumns: [maxPx(100, 50), maxPx(100, 50), maxPx(100, 50)].join(' ')