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-cn] sync translated content #13204

Merged
merged 2 commits into from
May 11, 2023
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
11 changes: 6 additions & 5 deletions files/zh-cn/_redirects.txt
Original file line number Diff line number Diff line change
Expand Up @@ -572,7 +572,7 @@
/zh-CN/docs/Glossary/通用首部 /zh-CN/docs/Glossary/General_header
/zh-CN/docs/Glossary/面向对象编程 /zh-CN/docs/Glossary/OOP
/zh-CN/docs/HTML /zh-CN/docs/Web/HTML
/zh-CN/docs/HTML/Block-level_elements /zh-CN/docs/Web/HTML/Block-level_elements
/zh-CN/docs/HTML/Block-level_elements /zh-CN/docs/Glossary/Block-level_content
/zh-CN/docs/HTML/Canvas /zh-CN/docs/Web/API/Canvas_API
/zh-CN/docs/HTML/Canvas/Tutorial /zh-CN/docs/Web/API/Canvas_API/Tutorial
/zh-CN/docs/HTML/Content_Editable /zh-CN/docs/Web/HTML/Global_attributes/contenteditable
Expand All @@ -599,7 +599,7 @@
/zh-CN/docs/HTML/HTML_Elements /zh-CN/docs/Web/HTML/Element/Heading_Elements
/zh-CN/docs/HTML/HTML_Elements/time /zh-CN/docs/Web/HTML/Element/time
/zh-CN/docs/HTML/Introduction /zh-CN/docs/learn/HTML/Introduction_to_HTML
/zh-CN/docs/HTML/块级元素 /zh-CN/docs/Web/HTML/Block-level_elements
/zh-CN/docs/HTML/块级元素 /zh-CN/docs/Glossary/Block-level_content
/zh-CN/docs/HTML\Canvas\Tutorial /zh-CN/docs/Web/API/Canvas_API/Tutorial
/zh-CN/docs/HTTP /zh-CN/docs/Web/HTTP
/zh-CN/docs/IndexedDB /zh-CN/docs/Web/API/IndexedDB_API
Expand Down Expand Up @@ -2300,6 +2300,7 @@
/zh-CN/docs/Web/Guide/Using_FormData_Objects /zh-CN/docs/Web/API/FormData/Using_FormData_Objects
/zh-CN/docs/Web/HTML/Applying_color /zh-CN/docs/Web/CSS/CSS_Colors/Applying_color
/zh-CN/docs/Web/HTML/Attributes/自动完成属性 /zh-CN/docs/Web/HTML/Attributes/autocomplete
/zh-CN/docs/Web/HTML/Block-level_elements /zh-CN/docs/Glossary/Block-level_content
/zh-CN/docs/Web/HTML/CORS_settings_attributes /zh-CN/docs/Web/HTML/Attributes/crossorigin
/zh-CN/docs/Web/HTML/Canvas /zh-CN/docs/Web/API/Canvas_API
/zh-CN/docs/Web/HTML/Canvas/Canvas教程 /zh-CN/docs/Web/API/Canvas_API/Tutorial
Expand All @@ -2326,14 +2327,15 @@
/zh-CN/docs/Web/HTML/Forms/表单入门 /zh-CN/docs/Learn/Forms/Your_first_form
/zh-CN/docs/Web/HTML/Global_attributes/摩缺 /zh-CN/docs/Web/HTML/Global_attributes/accesskey
/zh-CN/docs/Web/HTML/Index /zh-CN/docs/Web/HTML
/zh-CN/docs/Web/HTML/Inline_elemente /zh-CN/docs/Web/HTML/Inline_elements
/zh-CN/docs/Web/HTML/Inline_elemente /zh-CN/docs/Glossary/Inline-level_content
/zh-CN/docs/Web/HTML/Inline_elements /zh-CN/docs/Glossary/Inline-level_content
/zh-CN/docs/Web/HTML/Introduction /zh-CN/docs/learn/HTML/Introduction_to_HTML
/zh-CN/docs/Web/HTML/Link_types /zh-CN/docs/Web/HTML/Attributes/rel
/zh-CN/docs/Web/HTML/Link_types/prefetch /zh-CN/docs/Web/HTML/Attributes/rel/prefetch
/zh-CN/docs/Web/HTML/Link_types/preload /zh-CN/docs/Web/HTML/Attributes/rel/preload
/zh-CN/docs/Web/HTML/Optimizing_your_pages_for_speculative_parsing /zh-CN/docs/Glossary/Speculative_parsing
/zh-CN/docs/Web/HTML/全局属性 /zh-CN/docs/Web/HTML/Global_attributes
/zh-CN/docs/Web/HTML/内联元素 /zh-CN/docs/Web/HTML/Inline_elements
/zh-CN/docs/Web/HTML/内联元素 /zh-CN/docs/Glossary/Inline-level_content
/zh-CN/docs/Web/HTML/动作 /zh-CN/docs/Glossary/Speculative_parsing
/zh-CN/docs/Web/HTML/属性 /zh-CN/docs/Web/HTML/Attributes
/zh-CN/docs/Web/HTTP/Access_control_CORS /zh-CN/docs/Web/HTTP/CORS
Expand Down Expand Up @@ -2716,7 +2718,6 @@
/zh-CN/docs/learn/常见问题/What_is_accessibility /zh-CN/docs/Learn/Common_questions/Design_and_accessibility/What_is_accessibility
/zh-CN/docs/learn/常见问题/网页,网站,网页服务器和搜索引擎的区别是什么? /zh-CN/docs/Learn/Common_questions/Web_mechanics/Pages_sites_servers_and_search_engines
/zh-CN/docs/learn/探索浏览器开发者工具 /zh-CN/docs/Learn/Common_questions/Tools_and_setup/What_are_browser_developer_tools
/zh-CN/docs/orphaned/Web/HTTP/Headers/Set-Cookie/SameSite /zh-CN/docs/Web/HTTP/Headers/Set-Cookie#samesitesamesite-value
/zh-CN/docs/为Firefox_3升级扩展 /zh-CN/docs/Mozilla/Firefox/Releases/3/Updating_extensions
/zh-CN/docs/使用Javascript和DOM_Interfaces来处理HTML /zh-CN/docs/Web/API/Document_Object_Model/Traversing_an_HTML_table_with_JavaScript_and_DOM_Interfaces
/zh-CN/docs/安全 /zh-CN/docs/Web/Security
Expand Down
46 changes: 23 additions & 23 deletions files/zh-cn/_wikihistory.json
Original file line number Diff line number Diff line change
Expand Up @@ -413,6 +413,18 @@
"modified": "2019-04-26T07:01:02.583Z",
"contributors": ["心斩心鬼", "Sheppy"]
},
"Glossary/Block-level_content": {
"modified": "2019-03-18T20:38:24.578Z",
"contributors": [
"kmc947373",
"CraigZeng",
"FredWe",
"Breezewish",
"teoli",
"ziyunfei",
"wdlth"
]
},
"Glossary/Block/CSS": {
"modified": "2020-02-12T10:46:35.036Z",
"contributors": ["RainSlide", "XdCareWy"]
Expand Down Expand Up @@ -1050,6 +1062,17 @@
"modified": "2019-03-18T21:36:43.305Z",
"contributors": ["maoyumaoxun"]
},
"Glossary/Inline-level_content": {
"modified": "2020-08-05T19:04:54.777Z",
"contributors": [
"mitaosi",
"chrisdavidmills",
"Raine_Huang",
"FredWe",
"ziyunfei",
"pmtao"
]
},
"Glossary/Input_method_editor": {
"modified": "2020-11-05T12:12:12.471Z",
"contributors": ["xgqfrms"]
Expand Down Expand Up @@ -21784,18 +21807,6 @@
"modified": "2020-10-15T22:29:06.417Z",
"contributors": ["chanvin"]
},
"Web/HTML/Block-level_elements": {
"modified": "2019-03-18T20:38:24.578Z",
"contributors": [
"kmc947373",
"CraigZeng",
"FredWe",
"Breezewish",
"teoli",
"ziyunfei",
"wdlth"
]
},
"Web/HTML/CORS_enabled_image": {
"modified": "2020-05-06T06:27:48.960Z",
"contributors": [
Expand Down Expand Up @@ -23193,17 +23204,6 @@
"modified": "2019-06-05T06:41:04.292Z",
"contributors": ["Martin.Chow"]
},
"Web/HTML/Inline_elements": {
"modified": "2020-08-05T19:04:54.777Z",
"contributors": [
"mitaosi",
"chrisdavidmills",
"Raine_Huang",
"FredWe",
"ziyunfei",
"pmtao"
]
},
"Web/HTML/Microdata": {
"modified": "2019-07-13T06:56:53.858Z",
"contributors": ["wangfangping"]
Expand Down
Original file line number Diff line number Diff line change
@@ -1,11 +1,9 @@
---
title: 块级元素
slug: Web/HTML/Block-level_elements
slug: Glossary/Block-level_content
---

{{HTMLSidebar}}

HTML(超文本标记语言)中元素大多数都是“块级”元素或[行内元素](/zh-CN/docs/Web/HTML/Inline_elements)。块级元素占据其父元素(容器)的整个水平空间,垂直空间等于其内容高度,因此创建了一个“块”。这篇文章帮助解释这个概念。
HTML(超文本标记语言)中元素大多数都是“块级”元素或[行级元素](/zh-CN/docs/Glossary/Inline-level_content)。块级元素占据其父元素(容器)的整个水平空间,垂直空间等于其内容高度,因此创建了一个“块”。这篇文章帮助解释这个概念。

通常浏览器会在块级元素前后另起一个新行。下面的例子表明了块级元素的作用:

Expand Down Expand Up @@ -91,4 +89,4 @@ HTML 标准中块级元素和行内元素的区别至高出现在 4.01 标准中

### 参见

- [行内元素](/zh-CN/docs/Web/HTML/Inline_elements)
- [行级元素](/zh-CN/docs/Glossary/Inline-level_content)
48 changes: 48 additions & 0 deletions files/zh-cn/glossary/inline-level_content/index.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,48 @@
---
title: 行级元素
slug: Glossary/Inline-level_content
original_slug: Web/HTML/Inline_elements
---

{{HTMLSidebar}}

## 摘要

HTML(超文本标记语言)元素大多数都是行级元素或[块级元素](/zh-CN/docs/Glossary/Block-level_content)。一个行级元素只占据它对应标签的边框所包含的空间。下面这个例子说明了行级元素的作用范围:

## 行级元素示例

### HTML

```html
<p>This <span>span</span> is an inline element; its background has been colored to display both the beginning and end of the inline element's influence</p>
```

### CSS

```css
span { background-color: #8ABB55; }
```

{{ EmbedLiveSample('行级元素示例') }}

## 行级元素与块级元素对比

- 内容
- : 一般情况下,行级元素只能包含数据和其他行级元素。
而块级元素可以包含行级元素和其他块级元素。这种结构上的包含继承区别可以使块级元素创建比行级元素更”大型“的结构。
- 格式
- : 默认情况下,行级元素不会以新行开始,而块级元素会新起一行。

## 行级元素列表

下面的元素都是行级元素:

- [b](/zh-CN/docs/Web/HTML/Element/b)、[big](/zh-CN/docs/Web/HTML/Element/big)、[i](/zh-CN/docs/Web/HTML/Element/i)、[small](/zh-CN/docs/Web/HTML/Element/small)、[tt](/zh-CN/docs/Web/HTML/Element/tt)
- [abbr](/zh-CN/docs/Web/HTML/Element/abbr)、[acronym](/zh-CN/docs/Web/HTML/Element/acronym)、[cite](/zh-CN/docs/Web/HTML/Element/cite)、[code](/zh-CN/docs/Web/HTML/Element/code)、[dfn](/zh-CN/docs/Web/HTML/Element/dfn)、[em](/zh-CN/docs/Web/HTML/Element/em)、[kbd](/zh-CN/docs/Web/HTML/Element/kbd)、[strong](/zh-CN/docs/Web/HTML/Element/strong)、[samp](/zh-CN/docs/Web/HTML/Element/samp)、[var](/zh-CN/docs/Web/HTML/Element/var)
- [a](/zh-CN/docs/Web/HTML/Element/a)、[bdo](/zh-CN/docs/Web/HTML/Element/bdo)、[br](/zh-CN/docs/Web/HTML/Element/br)、[img](/zh-CN/docs/Web/HTML/Element/Img)、[map](/zh-CN/docs/Web/HTML/Element/map)、[object](/zh-CN/docs/Web/HTML/Element/object)、[q](/zh-CN/docs/Web/HTML/Element/q)、[script](/zh-CN/docs/Web/HTML/Element/Script)、[span](/zh-CN/docs/Web/HTML/Element/span)、[sub](/zh-CN/docs/Web/HTML/Element/sub)、[sup](/zh-CN/docs/Web/HTML/Element/sup)
- [button](/zh-CN/docs/Web/HTML/Element/button)、[input](/zh-CN/docs/Web/HTML/Element/Input)、[label](/zh-CN/docs/Web/HTML/Element/label)、[select](/zh-CN/docs/Web/HTML/Element/select)、[textarea](/zh-CN/docs/Web/HTML/Element/textarea)

## 参见

- [块级元素](/zh-CN/docs/Glossary/Block-level_content)
10 changes: 5 additions & 5 deletions files/zh-cn/learn/css/css_layout/normal_flow/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -36,15 +36,15 @@ slug: Learn/CSS/CSS_layout/Normal_Flow

## 默认情况下,元素是如何布局的?

首先,取得元素的内容来放在一个独立的元素盒子中,然后在其周边加上内边距、边框和外边距 --- 就是我们之前看到的盒子模型。
首先,取得元素的内容来放在一个独立的元素盒子中,然后在其周边加上内边距、边框和外边距——就是我们之前看到的盒子模型。

默认的,一个[块级元素](/zh-CN/docs/Web/HTML/Block-level_elements)的内容宽度是其父元素的 100%,其高度与其内容高度一致。[内联元素](/zh-CN/docs/Web/HTML/Inline_elements)的 height width 与内容一致。你无法设置内联元素的 height width --- 它们就那样置于块级元素的内容里。如果你想控制内联元素的尺寸,你需要为元素设置`display: block;` (或者,`display: inline-block;` inline-block 混合了 inline 和 block 的特性。)
默认的,一个[块级元素](/zh-CN/docs/Glossary/Block-level_content)的内容宽度是其父元素的 100%,其高度与其内容高度一致。[行级元素](/zh-CN/docs/Glossary/Inline-level_content)的 height width 与内容一致。你无法设置行级元素的 height width——它们就那样置于块级元素的内容里。如果你想控制内联元素的尺寸,你需要为元素设置 `display: block;`(或者,`display: inline-block;` inline-block 混合了 inline 和 block 的特性。)

这样解释了独立元素的布局,但是元素之间又是如何相互影响的呢?正常布局流(在布局介绍里提到过)是一套在浏览器视口内放置、组织元素的系统。默认的,块级元素按照基于其父元素的[书写顺序](/zh-CN/docs/Web/CSS/writing-mode)(_默认值:_ horizontal-tb) 的*块流动方向 (block flow direction)*放置 --- 每个块级元素会在上一个元素下面另起一行,它们会被设置好的 margin 分隔。在英语,或者其他水平书写、自上而下模式里,块级元素是垂直组织的。
这样解释了独立元素的布局,但是元素之间又是如何相互影响的呢?正常布局流(在布局介绍里提到过)是一套在浏览器视口内放置、组织元素的系统。默认的,块级元素按照基于其父元素的[书写顺序](/zh-CN/docs/Web/CSS/writing-mode)(_默认值_:horizontal-tb) 的*块流动方向*(block flow direction)放置——每个块级元素会在上一个元素下面另起一行,它们会被设置好的 margin 分隔。在英语,或者其他水平书写、自上而下模式里,块级元素是垂直组织的。

内联元素的表现有所不同 --- 它们不会另起一行;只要在其父级块级元素的宽度内有足够的空间,它们与其他内联元素、相邻的文本内容(或者被包裹的)被安排在同一行。如果空间不够,溢出的文本或元素将移到新的一行。
内联元素的表现有所不同——它们不会另起一行;只要在其父级块级元素的宽度内有足够的空间,它们与其他内联元素、相邻的文本内容(或者被包裹的)被安排在同一行。如果空间不够,溢出的文本或元素将移到新的一行。

如果两个相邻的元素都设置了 margin 并且两个 margin 有重叠,那么更大的设置会被保留,小的则会消失 --- 这被称为外边距叠加,我们之前见到过。
如果两个相邻的元素都设置了 margin 并且两个 margin 有重叠,那么更大的设置会被保留,小的则会消失——这被称为外边距叠加,我们之前见到过。

我们来看一个对全部这些做出解释的简单例子:

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -225,7 +225,7 @@ textarea.onkeyup = () => {

> **备注:** 在这篇文章中提到的“块”和“内联”,不应该与 [CSS 盒子的类型](/zh-CN/docs/Learn/CSS/Building_blocks/The_box_model#块级盒子(block_box)_和_内联盒子(inline_box))中的同名术语相混淆。尽管它们默认是相关的,但改变 CSS 显示类型并不会改变元素的分类,也不会影响它可以包含和被包含于哪些元素。防止这种混淆也是 HTML5 摒弃这些术语的原因之一。

> **备注:** 你可以查阅包含了块级元素和内联元素列表的参考页面。参见[块级元素](/zh-CN/docs/Web/HTML/Block-level_elements)和[内联元素](/zh-CN/docs/Web/HTML/Inline_elements)页面。
> **备注:** 你可以查阅包含了块级元素和内联元素列表的参考页面。参见[块级元素](/zh-CN/docs/Glossary/Block-level_content)和[内联元素](/zh-CN/docs/Glossary/Inline-level_content)页面。

### 空元素

Expand Down
2 changes: 1 addition & 1 deletion files/zh-cn/web/css/column-span/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -102,5 +102,5 @@ h2 {

## 参见

- [行级元素](/zh-CN/docs/Web/HTML/Inline_elements)
- [行级元素](/zh-CN/docs/Glossary/Inline-level_content)
- {{domxref("HTMLSpanElement")}}
2 changes: 1 addition & 1 deletion files/zh-cn/web/css/containing_block/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ original_slug: Web/CSS/All_About_The_Containing_Block

{{CSSRef}}

一个元素的尺寸和位置经常受其**包含块**(containing block)的影响。大多数情况下,包含块就是这个元素最近的祖先[块元素](/zh-CN/docs/Web/HTML/Block-level_elements)的[内容区域](/zh-CN/docs/Web/CSS/CSS_Box_Model/Introduction_to_the_CSS_box_model#内容区域),但也不是总是这样。在本文中,我们来过一遍确定包含块的所有因素。
一个元素的尺寸和位置经常受其**包含块**(containing block)的影响。大多数情况下,包含块就是这个元素最近的祖先[块元素](/zh-CN/docs/Glossary/Block-level_content)的[内容区域](/zh-CN/docs/Web/CSS/CSS_Box_Model/Introduction_to_the_CSS_box_model#内容区域),但也不是总是这样。在本文中,我们来过一遍确定包含块的所有因素。

当一个客户端代理(比如说浏览器)展示一个文档的时候,对于每一个元素,它都产生了一个盒子。每一个盒子都被划分为四个区域:

Expand Down
Loading