Skip to content

Commit

Permalink
[zh-cn] update css <length> value (#24510)
Browse files Browse the repository at this point in the history
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
Co-authored-by: skyclouds2001 <[email protected]>
Co-authored-by: A1lo <[email protected]>
  • Loading branch information
4 people authored Nov 18, 2024
1 parent 128357c commit 447e304
Show file tree
Hide file tree
Showing 3 changed files with 178 additions and 73 deletions.
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
---
title: CSS 的值与单位
title: CSS 值和单位
slug: Learn/CSS/Building_blocks/Values_and_units
---

Expand Down Expand Up @@ -130,7 +130,7 @@ CSS 中的值类型是一种定义了一些可使用的值的集合的方式。
| `Q` | 四分之一毫米 | 1Q = 1/40th of 1cm |
| `in` | 英寸 | 1in = 2.54cm = 96px |
| `pc` | 派卡 | 1pc = 1/6th of 1in |
| `pt` | | 1pt = 1/72th of 1in |
| `pt` | | 1pt = 1/72th of 1in |
| `px` | 像素 | 1px = 1/96th of 1in |

这些值中的大多数在用于打印时比用于屏幕输出时更有用。例如,我们通常不会在屏幕上使用 `cm`(厘米)。惟一一个你经常使用的值,估计就是 `px`(像素)。
Expand All @@ -139,7 +139,7 @@ CSS 中的值类型是一种定义了一些可使用的值的集合的方式。

相对长度单位是相对于其他某些东西的。例如:

- `em` `rem` 分别相对于父元素和根元素的字体大小
- `em` 相对于本元素的字体大小,或者在用于 {{cssxref("font-size")}} 时相对于父元素的字体大小。`rem` 相对于根元素的字体大小
- `vh``vw` 分别相对于视口的高度和宽度。

使用相对单位的好处是,通过一些精心的规划,你可以使文本或其他元素的大小相对于页面上的任何指定的东西进行缩放。要获取可用的相对单位的完整列表,请参阅 {{cssxref("length")}} 类型的参考页面。
Expand Down
19 changes: 10 additions & 9 deletions files/zh-cn/web/css/css_values_and_units/index.md
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
---
title: CSS 值与单位
title: CSS 值和单位
slug: Web/CSS/CSS_Values_and_Units
---

Expand Down Expand Up @@ -100,15 +100,15 @@ left | right | none | inline-start | inline-end

### 整数

一个整数包含 `0``9`的一个或多个十进制数字,例如 `1024``-55`。一个整数可能额外包含 `+``-` 前缀,在正负号和数值之间没有任何空格。
一个整数包含 `0``9` 的一个或多个十进制数字,例如 `1024``-55`。一个整数可能额外包含 `+``-` 前缀,在正负号和数值之间没有任何空格。

### 数值

{{cssxref("&lt;number&gt;")}} 表示一个真正的数,有可能又或者没有小数点和小数部分。例如 `0.255``128``-1.2`。数值也可能包含前缀 `+``-` 标识正负。

### 尺寸

{{cssxref("&lt;dimension&gt;")}} 是一个包含单位的 `<number>`,例如 `45deg``100ms`,或者 `10px`。单位是大小写敏感的,且数值和单位之间不允许有任何的空格或其他字符。例如 `1 cm` 不是一个合法的值。
{{cssxref("&lt;dimension&gt;")}} 是一个包含单位的 `<number>`,例如 `45deg``100ms` `10px`。单位是大小写敏感的,且数值和单位之间不允许有任何的空格或其他字符。例如 `1 cm` 不是一个合法的值。

CSS 使用尺寸来指定:

Expand All @@ -130,7 +130,7 @@ CSS 使用尺寸来指定:
| ------ | ------------------------------------------------------------------------------------------------------------------------------------- |
| `em` | 元素的字号 |
| `ex` | 字体的 X 字高(x-height) |
| `cap` | 字体中大写字母的标称高度 |
| `cap` | 字体中大写字母的大写字高 |
| `ch` | Average character advance of a narrow glyph in the element’s font, as represented by the “0” (ZERO, U+0030) glyph. |
| `ic` | Average character advance of a full width glyph in the element’s font, as represented by the“水” (CJK water ideograph, U+6C34) glyph. |
| `rem` | 根元素的字体大小。 |
Expand Down Expand Up @@ -240,9 +240,10 @@ The {{cssxref("&lt;position&gt;")}} type defines 2D positioning of an object ins

### Functional notation

- {{cssxref("calc()")}}
- {{cssxref("calc", "calc()")}}
- {{cssxref("min", "min()")}}
- {{cssxref("max", "max()")}}
- {{cssxref("minmax", "minmax()")}}
- {{cssxref("clamp", "clamp()")}}
- {{cssxref("toggle", "toggle()")}}
- {{cssxref("attr", "attr()")}}
Expand All @@ -253,11 +254,11 @@ White space is allowed, but optional inside the parentheses. (But see notes rega

Some legacy functional notations such as `rgba()` use commas, but generally commas are only used to separate items in a list. If a comma is used to separate arguments, white space is optional before and after the comma.

## Specifications
## 规范

{{Specifications}}

## See also
## 参见

- [CSS Basic Data Types](/zh-CN/docs/Web/CSS/CSS_Types)
- [Introduction to CSS: Values and Units](/zh-CN/docs/Learn/CSS/Introduction_to_CSS/Values_and_units)
- [CSS 基本数据类型](/zh-CN/docs/Web/CSS/CSS_Types)
- [CSS 介绍:值和单位](/zh-CN/docs/Learn/CSS/Introduction_to_CSS/Values_and_units)
Loading

0 comments on commit 447e304

Please sign in to comment.