有水平排水沟的特定术语吗?


12

上下文
我的团队正在响应式网站上工作,我们允许用户配置页面的某些属性,包括网格“单元”之间的空间。我们讨论了正确的术语,以识别“单元之间的空间”。显然,我们可以使用“ margin”之类的东西,但这有点太宽了,因为它会包括页面和最外面的单元之间的空间。我们只想识别单元格之间的空间。我们的用户不一定精通技术(例如CSS等),但可能在图形设计方面具有一定的背景(或至少熟悉通用术语)。

问题
“装订线”似乎是最正确的术语,但是我可以找到的关于“装订线”的大多数定义都是专门针对之间的空间。

之间的间距是否有特定术语?还是简单地将它们称为“水平装订线”是否合适?

示例
下面是我试图识别的示例。
(图片来自https://www.init.de/en/news/sensitive-design

在此处输入图片说明

我认为当前术语中的问题
“水平(/垂直)装订线”有点令人困惑,因为目前尚不清楚该装订线是否位于水平(/垂直)元素之间,或者是否在垂直(/)之间提供水平(/垂直)间距水平)元素。我的团队在哪个定义正确的问题上存在分歧,因此,我认为这足以证明该短语确实令人困惑。

至少对于网络而言,“填充”和“边距”不适用于我所描述的内容。填充是指边框和内容之间的空间,而空白是指元素周围的空间。两个相邻元素(每个元素的边距为10px)之间会有20px的装订线。(是的,我知道CSS边距经常崩溃,但并非总是如此。)

我已经看到了在响应式网格框架中经常使用的“装订线”一词,因此我知道这是Web开发中可以接受的术语。我只是想知道“水平装订线”是否有一个更合适的术语。


好问题,我不知道这个词。但是,“装订线”一词经常被滥用。列之间的间距适当地称为胡同看到这张图片进行澄清
Zach Saucier 2015年

您明确不是要领导这里,是吗?段落间距呢?
e100 2015年

上下文就是一切。听起来像一张桌子,我建议您在选择电子表格单元格的格式设置选项时借用MS Excel使用的任何术语(我认为这是“填充” IIRC)
DA01,2015年

至于段落间距,如果我们真正谈论的是列中段落之间的水平间距,我相信图形设计师使用的术语 “段落间距”。
2015年

单元格间距不正确,因为这会增加表/网格外部的空间
JDB仍记得Monica

Answers:


3
简短答案

我将使用“行间距”。

长答案

正如JDB所述,我也宁愿使用与Web相关的术语,而不是尝试从(迷人的)印刷媒体世界中导入排版术语。

我将使用术语“列间距”和“行间距”,因为大多数网格布局都使用术语“列”和“网格”。我会避免使用术语“ margin”和“ padding”来避免与CSS关键字冲突。


1
新的CSS Grid规范定义了grid-row-gapgrid-column-gap,但是我实际上更喜欢“ spacing”。
JDB仍记得莫妮卡

7

在Web设计的范围内(这似乎是OP的问题),我宁愿使用与Web相关的术语,而不是尝试从(迷人的)印刷媒体世界中导入排版术语。

我称这种“垂直边距”为CSS margin属性。边距是相邻元素的边框之间的间距(与填充(元素内部的间距,即边框和内容之间的间距)相对。

在此处输入图片说明

用W3C的话来说:

边距清除元素周围的区域(边框之外)。页边距没有背景色,并且是完全透明的。 资源

请注意,元素的边框可以是透明的。它不需要是可见的。

开发人员必须非常清楚地理解这个术语。在我看来,尽管“保证金”比“装订线”,“过道”或“弹头”不那么吸引人,但客户一定会发现它是一个更友好的术语。

离题

Cellpaddingcellspacing类似于paddingmargin,但他们太具体。与常规CSS属性相反,它们是<table><td>标记的有效html 属性。它们只能应用于那些标签。如果您仅在谈论表(如使用<table>标记制作的结构),那么调用该区域将是正确的cellspacing。如果你是在一般谈论的矩形区域(如在由定义的区域<div><span><img>或任何其他标记),那么margin会更准确。

就像旁边的评论一样,请注意,cellpadingand cellspacing属性在现代Web设计师和开发人员中被广泛使用,因为这种类型的属性将结构(HTML)与样式(CSS)混合在一起,导致页面难以维护和/或开发团队。开发商鼓励切莫使用这些属性和使用的CSS属性paddingmargin代替。

与过去一样,使用表创建通用布局也是如此。纯粹主义者声称表应仅用于显示表格数据。<div><span>标签应当用于脚手架。所有这一切都希望有一天我们将拥有语义正确的网页,因为这些标签在语义上标记了上下文,而不是仅是后台操纵。


2
“边距”是一个通用术语,指的是元素周围的空间,而“装订线”专门指的是元素之间的空间。例如,如果两个连续元素的边距均为10px,则它们之间的装订线宽度为20px。我已经看到“装订线”经常在各种网格布局框架中使用,因此我认为在网站的上下文中它不会超出范围。我只是想知道这是否是垂直堆叠元素之间的空间的正确术语。
JDB仍记得Monica

1
@JDB:足够公平……我想人们对“装订线”的接受程度取决于元素之间的间隔取决于您的听众。顺便说一句,在HTML / CSS中,边距有时会折叠在一起,因此两个边距为10px的元素不一定会有20px的装订线。如果边缘崩溃,它们最终可能会出现10像素的装订线。css-tricks.com/almanac/properties/m/margin
cockypup15年

此外,CSS“ margin”(不是很烦人,我只是对此主题非常热情)不是一个通用术语。它有一个非常具体的定义。w3.org/TR/CSS2/box.html
cockypup

1
好点子。我同意最好使用一个术语来指代“元素之间最终剩下的实际空间”。
cockypup15年

1
即使他们列出了边距不会塌陷的所有方式,”边距塌陷似乎是一个例外,而不是文档中的规则。至少,文档的阅读方式像英语语法书:没有规则和所有例外。也许,至少为您的团队定义了一个术语(如“胡同”),该术语是(非)塌陷后元素之间的垂直边距
Yorik 2015年

4

在排版方面,Slug是水平间距的常用术语。-段落之后/之前的空间,部分之间或规则之间的水平间隙等。子弹的指定大小与字型大小相似,并且将与金属字型放在同一行以产生适当的垂直间距。

根据编辑...。

Cell padding似乎是最明显的选择。或者cell spacing


这个术语也适用于节后的间距吗?还是只是段落?
Zach Saucier 2015年

1
它适用于使用水平空间的任何区域。在热型的天,使用了塞在被排版这些是否是段落,列,规则等的任何区域之间水平创造更加空间
斯科特

我喜欢它,但是由于存在第二个定义,这在网页设计中非常令人困惑。
JDB仍然记得莫妮卡2015年

1
Slug是用于任何间距的术语。凹陷的金属块,因此不会粘墨。它们用于创建水平间距和对齐类型,以及用于在类型之间创建段落间距或其他间距需求。我意识到这不是当今许多设计师都知道的一个名词,除非他们曾经为报纸工作过。那并不是真的不准确。垂直项目是xheight,前导和子弹。在严格的网页设计方面,我倾向于使用“ margin”。
斯科特

1
...并意识到在我发布此答案后,该问题已被编辑以添加更多内容。以前没有真正提到过“网络”。
斯科特

1

在布局设计中,网格中的那些水平排水沟称为“流水线”或“吊线”


2
欢迎来到GD.SE!请更好地解释您的答案。“布局设计”是什么意思?
Mensch

要补充Kurt所说的话,也许您还可以包括视觉示例。
WELZ
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.