Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[zh-tw] sync translated content #26174

Merged
merged 2 commits into from
Mar 5, 2025
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions files/zh-tw/_redirects.txt
Original file line number Diff line number Diff line change
Expand Up @@ -553,6 +553,7 @@
/zh-TW/docs/Web/CSS/Common_CSS_Questions /zh-TW/docs/Learn_web_development/Howto/Solve_CSS_problems/CSS_FAQ
/zh-TW/docs/Web/CSS/Descendant_selectors /zh-TW/docs/Web/CSS/Descendant_combinator
/zh-TW/docs/Web/CSS/Inheritance /zh-TW/docs/Web/CSS/CSS_cascade/Inheritance
/zh-TW/docs/Web/CSS/Shorthand_properties /zh-TW/docs/Web/CSS/CSS_cascade/Shorthand_properties
/zh-TW/docs/Web/CSS/Syntax /zh-TW/docs/Web/CSS/CSS_syntax/Syntax
/zh-TW/docs/Web/CSS/border-image/border-image /zh-TW/docs/Web/CSS/border-image
/zh-TW/docs/Web/CSS/彈頭 /zh-TW/docs/Web/CSS/box-sizing
Expand Down
16 changes: 8 additions & 8 deletions files/zh-tw/_wikihistory.json
Original file line number Diff line number Diff line change
Expand Up @@ -3766,6 +3766,14 @@
"alk03073135"
]
},
"Web/CSS/CSS_cascade/Shorthand_properties": {
"modified": "2019-03-23T23:05:17.353Z",
"contributors": [
"fscholz",
"irvinfly",
"wildsky"
]
},
"Web/CSS/CSS_colors/Color_picker_tool": {
"modified": "2019-03-23T22:44:42.147Z",
"contributors": [
Expand Down Expand Up @@ -3874,14 +3882,6 @@
"MashKao"
]
},
"Web/CSS/Shorthand_properties": {
"modified": "2019-03-23T23:05:17.353Z",
"contributors": [
"fscholz",
"irvinfly",
"wildsky"
]
},
"Web/CSS/Type_selectors": {
"modified": "2020-10-15T22:16:41.850Z",
"contributors": [
Expand Down
2 changes: 1 addition & 1 deletion files/zh-tw/web/css/border-color/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ slug: Web/CSS/border-color

{{CSSRef}}

**`border-color`** 是一種[CSS](/zh-TW/docs/Web/CSS) [簡寫屬性](/zh-TW/docs/Web/CSS/Shorthand_properties),用來綜合設定元件四邊框線的顏色。
**`border-color`** 是一種[CSS](/zh-TW/docs/Web/CSS) [簡寫屬性](/zh-TW/docs/Web/CSS/CSS_cascade/Shorthand_properties),用來綜合設定元件四邊框線的顏色。

{{EmbedInteractiveExample("pages/css/border-color.html")}}

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -107,5 +107,5 @@ slug: Web/CSS/CSS_box_model/Mastering_margin_collapsing
- [實際值](/zh-TW/docs/Web/CSS/CSS_cascade/actual_value)

- [特性值定義語法](/zh-TW/docs/Web/CSS/CSS_Values_and_Units/Value_definition_syntax)
- [特性簡寫](/zh-TW/docs/Web/CSS/Shorthand_properties)
- [簡寫屬性](/zh-TW/docs/Web/CSS/CSS_cascade/Shorthand_properties)
- [可置換元素](/zh-TW/docs/Web/CSS/Replaced_element)
2 changes: 1 addition & 1 deletion files/zh-tw/web/css/css_cascade/inheritance/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -74,7 +74,7 @@ the words "emphasized text" will not have a border (since the initial value of {
- [實際值](/zh-TW/docs/Web/CSS/CSS_cascade/actual_value)

- [特性值定義語法](/zh-TW/docs/Web/CSS/CSS_Values_and_Units/Value_definition_syntax)
- [特性簡寫](/zh-TW/docs/Web/CSS/Shorthand_properties)
- [簡寫屬性](/zh-TW/docs/Web/CSS/CSS_cascade/Shorthand_properties)
- [可置換元素](/zh-TW/docs/Web/CSS/Replaced_element)

- {{ Cssxref("inherit") }}
Original file line number Diff line number Diff line change
@@ -1,13 +1,13 @@
---
title: 特性簡寫
slug: Web/CSS/Shorthand_properties
title: 簡寫屬性
slug: Web/CSS/CSS_cascade/Shorthand_properties
---

{{CSSRef}}

**_特性簡寫_**是一種可以同時設定許多其他 CSS 屬性值的 CSS 屬性。使用特性簡寫,網頁開發者可以寫出更簡潔、且通常更具可讀性的樣式表,省時又省力。
**_簡寫屬性_**是一種可以同時設定許多其他 CSS 屬性值的 CSS 屬性。使用簡寫屬性,Web 開發者可以寫出更簡潔、且通常更具可讀性的樣式表,省時又省力。

CSS 規範中定義,特性簡寫用來組合作用於相同主題的常見性質。舉例來說,CSS {{cssxref("background")}} 這個性質是個特性簡寫,可同時定義 {{cssxref("background-color")}}, {{cssxref("background-image")}}, {{cssxref("background-repeat")}}, 和 {{cssxref("background-position")}} 等屬性。同樣的,最常用的字體相關屬性,可以使用 {{cssxref("font")}} 來定義;圍繞在方塊周圍的邊界,則可簡單地以 {{cssxref("margin")}} 簡寫來定義。
CSS 規範中定義,特性簡寫用來組合作用於相同主題的常見性質。舉例來說,CSS {{cssxref("background")}} 這個性質是個特性簡寫,可同時定義 {{cssxref("background-color")}}{{cssxref("background-image")}}{{cssxref("background-repeat")}} 和 {{cssxref("background-position")}} 等屬性。同樣的,最常用的字體相關屬性,可以使用 {{cssxref("font")}} 來定義;圍繞在方塊周圍的邊界,則可簡單地以 {{cssxref("margin")}} 簡寫來定義。

## 需謹慎之處

Expand Down Expand Up @@ -138,13 +138,85 @@ margin-bottom: 10px;
margin-left: 5px;
```

等同於下面的宣告(注意值的排序是順時鐘的順序:上,右,下,左 (TRBL,可以「trouble」這個單字的諧音來記憶)
等同於下面的宣告(注意值的排序是順時鐘的順序:上、右、下、左(TRBL,可以「trouble」這個單字的諧音來記憶)

```css
margin: 10px 5px 10px 5px;
```

## 相關連結

- [CSS Reference](/zh-TW/docs/Web/CSS/Reference)
- Shorthand properties: {{cssxref("background")}}, {{cssxref("font")}}, {{cssxref("margin")}}, {{cssxref("border")}}, {{cssxref("border-top")}}, {{cssxref("border-right")}}, {{cssxref("border-bottom")}}, {{cssxref("border-left")}}, {{cssxref("border-width")}}, {{cssxref("border-color")}}, {{cssxref("border-style")}}, {{cssxref("transition")}}, {{cssxref("transform")}}, {{cssxref("padding")}}, {{cssxref("list-style")}}, {{cssxref("border-radius")}}.
## 簡寫屬性

- {{cssxref("all")}}
- {{cssxref("animation")}}
- {{cssxref("animation-range")}}
- {{cssxref("background")}}
- {{cssxref("border")}}
- {{cssxref("border-block")}}
- {{cssxref("border-block-end")}}
- {{cssxref("border-block-start")}}
- {{cssxref("border-bottom")}}
- {{cssxref("border-color")}}
- {{cssxref("border-image")}}
- {{cssxref("border-inline")}}
- {{cssxref("border-inline-end")}}
- {{cssxref("border-inline-start")}}
- {{cssxref("border-left")}}
- {{cssxref("border-radius")}}
- {{cssxref("border-right")}}
- {{cssxref("border-style")}}
- {{cssxref("border-top")}}
- {{cssxref("border-width")}}
- {{cssxref("column-rule")}}
- {{cssxref("columns")}}
- {{cssxref("contain-intrinsic-size")}}
- {{cssxref("container")}}
- {{cssxref("flex")}}
- {{cssxref("flex-flow")}}
- {{cssxref("font")}}
- {{cssxref("font-synthesis")}}
- {{cssxref("font-variant")}}
- {{cssxref("gap")}}
- {{cssxref("grid")}}
- {{cssxref("grid-area")}}
- {{cssxref("grid-column")}}
- {{cssxref("grid-row")}}
- {{cssxref("grid-template")}}
- {{cssxref("inset")}}
- {{cssxref("inset-block")}}
- {{cssxref("inset-inline")}}
- {{cssxref("list-style")}}
- {{cssxref("margin")}}
- {{cssxref("margin-block")}}
- {{cssxref("margin-inline")}}
- {{cssxref("mask")}}
- {{cssxref("mask-border")}}
- {{cssxref("offset")}}
- {{cssxref("outline")}}
- {{cssxref("overflow")}}
- {{cssxref("overscroll-behavior")}}
- {{cssxref("padding")}}
- {{cssxref("padding-block")}}
- {{cssxref("padding-inline")}}
- {{cssxref("place-content")}}
- {{cssxref("place-items")}}
- {{cssxref("place-self")}}
- {{cssxref("position-try")}}
- {{cssxref("scroll-margin")}}
- {{cssxref("scroll-margin-block")}}
- {{cssxref("scroll-margin-inline")}}
- {{cssxref("scroll-padding")}}
- {{cssxref("scroll-padding-block")}}
- {{cssxref("scroll-padding-inline")}}
- {{cssxref("scroll-timeline")}}
- {{cssxref("text-decoration")}}
- {{cssxref("text-emphasis")}}
- {{cssxref("text-wrap")}}
- {{cssxref("transition")}}
- {{cssxref("view-timeline")}}
- {{cssxref("-webkit-text-stroke")}}
- {{cssxref("-webkit-border-before")}}
- {{cssxref("-webkit-mask-box-image")}}

## 參見

- [CSS 語法](/zh-TW/docs/Web/CSS/CSS_syntax/Syntax)
2 changes: 1 addition & 1 deletion files/zh-tw/web/css/css_syntax/syntax/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -88,5 +88,5 @@ There is another group of statements - the **nested statements**. These are stat
- [實際值](/zh-TW/docs/Web/CSS/CSS_cascade/actual_value)

- [特性值定義語法](/zh-TW/docs/Web/CSS/CSS_Values_and_Units/Value_definition_syntax)
- [特性簡寫](/zh-TW/docs/Web/CSS/Shorthand_properties)
- [簡寫屬性](/zh-TW/docs/Web/CSS/CSS_cascade/Shorthand_properties)
- [可置換元素](/zh-TW/docs/Web/CSS/Replaced_element)
6 changes: 3 additions & 3 deletions files/zh-tw/web/css/grid-template/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -5,11 +5,11 @@ slug: Web/CSS/grid-template

{{CSSRef}}

**`grid-template`**CSS 屬性是一個[速記屬性](/zh-TW/docs/Web/CSS/Shorthand_properties),用於定義{{glossary("grid column","grid columns")}}{{glossary("grid rows","rows")}}和{{glossary("grid areas","area")}}。
CSS 的 **`grid-template`** 屬性是一個用於定義{{glossary("grid column","網格欄")}}{{glossary("grid rows","")}}和{{glossary("grid areas","區域")}}的[簡寫屬性](/zh-TW/docs/Web/CSS/CSS_cascade/Shorthand_properties)

{{EmbedInteractiveExample("pages / css / grid-template.html")}}
{{EmbedInteractiveExample("pages/css/grid-template.html")}}

作者可以為長期屬性設置值:{{cssxref("grid-template-rows")}},{{cssxref("grid-template-columns")}}{{cssxref("grid-template-areas ")}}。
作者可以為長期屬性設置值:{{cssxref("grid-template-rows")}}{{cssxref("grid-template-columns")}}{{cssxref("grid-template-areas ")}}。

## 句法

Expand Down
2 changes: 1 addition & 1 deletion files/zh-tw/web/css/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -44,7 +44,7 @@ slug: Web/CSS
- [盒子模型](/zh-TW/docs/Web/CSS/CSS_box_model/Introduction_to_the_CSS_box_model)和[邊框的崩潰](/zh-TW/docs/Web/CSS/CSS_box_model/Mastering_margin_collapsing)
- [堆疊](/zh-TW/docs/CSS/Understanding_z-index/Stacking_context)和[格式化區塊](/zh-TW/docs/Web/CSS/CSS_display/Block_formatting_context)
- [初始值](/zh-TW/docs/Web/CSS/CSS_cascade/initial_value) 、[計算值(computed)](/zh-TW/docs/Web/CSS/CSS_cascade/computed_value)、 [使用值(used)](/zh-TW/docs/Web/CSS/CSS_cascade/used_value)和[運作值](/zh-TW/docs/Web/CSS/CSS_cascade/actual_value)
- [CSS 簡寫屬性](/zh-TW/docs/Web/CSS/Shorthand_properties)
- [CSS 簡寫屬性](/zh-TW/docs/Web/CSS/CSS_cascade/Shorthand_properties)
- [CSS 彈性盒子排版](/zh-TW/docs/Web/CSS/CSS_flexible_box_layout)
- [CSS 格線排版](/zh-TW/docs/Web/CSS/CSS_grid_layout)
- [媒體查詢](/zh-TW/docs/Web/CSS/CSS_media_queries)
Expand Down
2 changes: 1 addition & 1 deletion files/zh-tw/web/css/replaced_element/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -36,5 +36,5 @@ CSS 中所謂的「置換元素 (**Replaced element**)」,即是該元素所
- [實際值](/zh-TW/docs/Web/CSS/CSS_cascade/actual_value)

- [特性值定義語法](/zh-TW/docs/Web/CSS/CSS_Values_and_Units/Value_definition_syntax)
- [特性簡寫](/zh-TW/docs/Web/CSS/Shorthand_properties)
- [簡寫屬性](/zh-TW/docs/Web/CSS/CSS_cascade/Shorthand_properties)
- [可置換元素](/zh-TW/docs/Web/CSS/Replaced_element)
12 changes: 6 additions & 6 deletions files/zh-tw/web/css/transition/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -5,11 +5,11 @@ slug: Web/CSS/transition

{{CSSRef}}

**`transition`** [CSS](/zh-TW/docs/Web/CSS) 屬性是 {{ cssxref("transition-property") }}, {{ cssxref("transition-duration") }}, {{ cssxref("transition-timing-function") }}, and {{ cssxref("transition-delay") }}的 [特性簡寫](/zh-TW/docs/Web/CSS/Shorthand_properties)。
**`transition`** [CSS](/zh-TW/docs/Web/CSS) 屬性是 {{ cssxref("transition-property") }}{{ cssxref("transition-duration") }}{{ cssxref("transition-timing-function") }} {{ cssxref("transition-delay") }} 的[簡寫屬性](/zh-TW/docs/Web/CSS/CSS_cascade/Shorthand_properties)。

{{EmbedInteractiveExample("pages/css/transition.html")}}

Transitions 讓你可以定義元件在兩個狀態之間切換的轉場效果。兩個不同狀態可以使用[虛擬類別](/zh-TW/docs/Web/CSS/Pseudo-classes) 定義,像是{{cssxref(":hover")}} 或 {{cssxref(":active")}} 亦或是 使用 JavaScript 設定的狀態變化。
Transitions 讓你可以定義元件在兩個狀態之間切換的轉場效果。兩個不同狀態可以使用[虛擬類別](/zh-TW/docs/Web/CSS/Pseudo-classes)定義,像是{{cssxref(":hover")}} 或 {{cssxref(":active")}} 亦或是 使用 JavaScript 設定的狀態變化。

## 語法

Expand Down Expand Up @@ -43,16 +43,16 @@ transition: unset;

`transition` 屬性可以包含一個或多個轉場設定,每一項設定都以逗點分開。

每一項設定都描述著每一項屬性所對應的轉場效果(或是`all` 及 `none`這兩個特殊值) 。其包含了:
每一項設定都描述著每一項屬性所對應的轉場效果(或是 `all` 及 `none`這兩個特殊值。其包含了:

- 無或一個對應的屬性名稱。可以是:

- 關鍵字 `none`
- 關鍵字 `all`
- 以{{cssxref("<custom-ident>")}}命名的 CSS 屬性。
- 以 {{cssxref("<custom-ident>")}} 命名的 CSS 屬性。

- 無或一個{{cssxref("<single-transition-timing-function>")}} 表示所使用的漸變函式。
- 無、一個或兩個{{cssxref("<time>")}} 值。第一個值會被指派給{{cssxref("transition-duration")}}, 而第二個則被指派給{{cssxref("transition-delay")}}。
- 無或一個 {{cssxref("<single-transition-timing-function>")}} 表示所使用的漸變函式。
- 無、一個或兩個 {{cssxref("<time>")}} 值。第一個值會被指派給 {{cssxref("transition-duration")}}而第二個則被指派給 {{cssxref("transition-delay")}}。

當每個轉場設定不等長時,請參見 [當 property values list 之間不等長時...](/zh-TW/docs/Web/CSS/CSS_transitions/Using_CSS_transitions#當_property_value_list_之間並不等長時_...) 。簡而言之,多餘的描述(超過實際被執行的數量)會直接被忽略。

Expand Down