diff options
author | Peter Bengtsson <mail@peterbe.com> | 2020-12-08 14:40:17 -0500 |
---|---|---|
committer | Peter Bengtsson <mail@peterbe.com> | 2020-12-08 14:40:17 -0500 |
commit | 33058f2b292b3a581333bdfb21b8f671898c5060 (patch) | |
tree | 51c3e392513ec574331b2d3f85c394445ea803c6 /files/zh-cn/web/css/mask-border-width | |
parent | 8b66d724f7caf0157093fb09cfec8fbd0c6ad50a (diff) | |
download | translated-content-33058f2b292b3a581333bdfb21b8f671898c5060.tar.gz translated-content-33058f2b292b3a581333bdfb21b8f671898c5060.tar.bz2 translated-content-33058f2b292b3a581333bdfb21b8f671898c5060.zip |
initial commit
Diffstat (limited to 'files/zh-cn/web/css/mask-border-width')
-rw-r--r-- | files/zh-cn/web/css/mask-border-width/index.html | 86 |
1 files changed, 86 insertions, 0 deletions
diff --git a/files/zh-cn/web/css/mask-border-width/index.html b/files/zh-cn/web/css/mask-border-width/index.html new file mode 100644 index 0000000000..c161c7ac0e --- /dev/null +++ b/files/zh-cn/web/css/mask-border-width/index.html @@ -0,0 +1,86 @@ +--- +title: mask-border-width +slug: Web/CSS/mask-border-width +translation_of: Web/CSS/mask-border-width +--- +<div>{{CSSRef}}{{SeeCompatTable}}</div> + +<div><code><strong>mask-border-width</strong></code> <a href="/zh-CN/docs/Web/CSS">CSS</a> 属性设置元素的 <a href="/zh-CN/docs/Web/CSS/mask-border">mask border</a>的宽度</div> + +<h2 id="语法">语法</h2> + +<pre class="brush:css no-line-numbers">/* Keyword value */ +mask-border-width: auto; + +/* <length> value */ +mask-border-width: 1rem; + +/* <percentage> value */ +mask-border-width: 25%; + +/* <number> value */ +mask-border-width: 3; + +/* vertical | horizontal */ +mask-border-width: 2em 3em; + +/* top | horizontal | bottom */ +mask-border-width: 5% 15% 10%; + +/* top | right | bottom | left */ +mask-border-width: 5% 2em 10% auto; + +/* Global values */ +mask-border-width: inherit; +mask-border-width: initial; +mask-border-width: unset; +</pre> + +<p>可以使用从下面的值列表中选择的一个,两个,三个或四个值来指定<code>mask-border-width</code>属性。</p> + +<ul> + <li>指定一个值时,即对应四条边的宽度;</li> + <li>指定两个值时,第一个值对应上下边框的宽度,第二个值对应左右边框的宽度;</li> + <li>指定三个值时,第一个值对应上边框的宽度,第二个值对应左右边框的宽度,第三个值对应底部边框的宽度;</li> + <li>指定四个值时,按顺时针方向,分别对应上,右,下,左边框的宽度。</li> +</ul> + +<h3 id="值">值</h3> + +<dl> + <dt><code><length-percentage></code></dt> + <dd><code>mask</code>边框宽度指定一个值或者百分比,设定百分比时,是相对于<code>mask</code>的长度和宽度。不能为负数。</dd> + <dt><font face="consolas, Liberation Mono, courier, monospace"><span style="background-color: rgba(220, 220, 220, 0.5);"><number></span></font></dt> + <dd>mask边框宽度为元素<code>border-width</code>的倍数。不能为负数。</dd> + <dt><code>auto</code></dt> + <dd>使<code>mask-border</code>的宽度等于相应<a href="https://developer.mozilla.org/en-US/docs/Web/CSS/mask-border-slice" title="The mask-border-slice CSS property divides the image set by mask-border-source into regions. These regions are used to form the components of an element's mask border."><code>mask-border-slice</code></a>的固有宽度或高度(以适用者为准),如果图像没有所需的固有尺寸,则使用相应的边框宽度。</dd> +</dl> + +<h3 id="Formal_syntax">Formal syntax</h3> + +<pre class="syntaxbox">{{csssyntax}}</pre> + +<h2 id="Specifications" name="Specifications">Specifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName("CSS Masks", "#propdef-mask-border-width", "mask-border-width")}}</td> + <td>{{Spec2("CSS Masks")}}</td> + <td>Initial definition</td> + </tr> + </tbody> +</table> + +<p>{{cssinfo}}</p> + +<h2 id="浏览器兼容性">浏览器兼容性</h2> + +<p>待定</p> |