是的，你可以！

或者，如果不是这些术语，那么至少是下一个最好的事情。在 2020 年，使用 CSS 数学函数现在非常简单：min()，max()和clamp()。

min计算从逗号分隔的值列表（任意长度）中选择最小的值。这可用于定义 max-padding 或 max-margin 规则：

padding-right: min(50px, 5%);

max计算类似地从逗号分隔的值列表（任何长度）中选择最大值。这可用于定义最小填充或最小边距规则：

padding-right: max(15px, 5%);

clamp取三个值：最小值、首选值和最大值。

padding-right: clamp(15px, 5%, 50px);

MDN 指定钳位实际上只是简写：

max(MINIMUM, min(PREFERRED, MAXIMUM))

这里有一个clamp用于在值100px和200px之间包含25vw边距：

* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}
.container {
  width: 100vw;
  border: 2px dashed red;
}
.margin {
  width: auto;
  min-width: min-content;
  background-color: lightblue;
  padding: 10px;
  margin-right: clamp(100px, 25vw, 200px);
}

<div class="container">
  <div class="margin">
    The margin-right on this div uses 25vw as its preferred value,
    100px as its minimum, and 200px as its maximum.
  </div>
</div>

数学函数可以在各种不同的场景中使用，甚至可能是模糊的场景，如缩放font-size-它们不仅仅用于控制边距和填充。

Here is the caniuse list of browser support。覆盖范围通常非常好，包括几乎所有现代浏览器-除了一些辅助移动浏览器，尽管我自己没有测试过。

更新 2020

使用新的（编辑草稿中的）CSS 4 属性，您可以通过使用min()和max()来实现此目的（也可以使用clamp()作为min()和max()的简写

min( <calc-sum># )
where 
<calc-sum> = <calc-product> [ [ '+' | '-' ] <calc-product> ]*
where 
<calc-product> = <calc-value> [ '*' <calc-value> | '/' <number> ]*
where 
<calc-value> = <number> | <dimension> | <percentage> | ( <calc-sum> )

max( <calc-sum># )
    
where
<calc-sum> = <calc-product> [ [ '+' | '-' ] <calc-product> ]*
    
where  
<calc-product> = <calc-value> [ '*' <calc-value> | '/' <number> ]*
where 
<calc-value> = <number> | <dimension> | <percentage> | ( <calc-sum> )

clamp( <calc-sum>#{3} )
where 
<calc-sum> = <calc-product> [ [ '+' | '-' ] <calc-product> ]*
where 
<calc-product> = <calc-value> [ '*' <calc-value> | '/' <number> ]*
where 
<calc-value> = <number> | <dimension> | <percentage> | ( <calc-sum> )

片段

.min {
  /* demo */
  border: green dashed 5px;
  /*this your min padding-left*/
  padding-left: min(50vw, 50px);
}
.max {
  /* demo */
  border: blue solid 5px;
  /*this your max padding-left*/
  padding-left: max(50vw, 500px);
}
.clamp {
  /* demo */
  border: red dotted 5px;
  /*this your clamp padding-left*/
  padding-left: clamp(50vw, 70vw, 1000px);
}
/* demo */
* {
  box-sizing: border-box
}
section {
  width: 50vw;
}
div {
  height: 100px
}
/* end of demo */

<section>
  <div class="min"></div>
  <div class="max"></div>
  <div class="clamp"></div>
</section>

旧答案

不，你不能。

margin和padding属性没有min/max前缀

一个近似的方法是使用相对单位（vh/vw），但仍然不是min/max

正如 @ vigilante_stark 在the answer中指出的那样，CSS calc()函数可能是另一种解决方法，如下所示：

/* demo */
* {
  box-sizing: border-box
}
section {
  background-color: red;
  width: 50vw;
  height: 50px;
  position: relative;
}
div {
  width: inherit;
  height: inherit;
  position: absolute;
  top: 0;
  left: 0
}
/* end of demo */
.min {
  /* demo */
  border: green dashed 4px;
  /*this your min padding-left*/
  padding-left: calc(50vw + 50px);
}
.max {
  /* demo */
  border: blue solid 3px;
  /*this your max padding-left*/
  padding-left: calc(50vw + 200px);
}

<section>
  <div class="min"></div>
  <div class="max"></div>
</section>

我今天面临同样的问题。显然，解决方案很简单：

padding: calc(*put fixed pixels here*px + *put your required %age here*%) 

请注意，您必须将所需的 ％ 年龄减少一点以考虑固定像素。

我尝试在padding中使用 CSSmax函数来尝试此功能，但我的 css 中出现了解析错误。是我尝试的：

padding: 5px max(50vw - 350px, 10vw);

然后我试图将操作分成变量，这也不起作用

  --padding: calc(50vw - 350px); 
  --max-padding: max(1vw, var(--padding));
  padding: 5px var(--max-padding);

最终的工作只是嵌套我想要填充在类“居中”的 div 中，并使用最大宽度和宽度像这样

 .centered {
   width: 98vw;
   max-width: 700px;
   height: 100%;
   margin: 0 auto;
}

不幸的是，这似乎是模仿“max-padding”和“min-padding”的最佳方式。我想该技术对于“min-margin”和“max-margin”是相似的。希望这在某些时候被添加！