短语内容和流内容之间有什么区别?

时间:2015-05-14 09:11:51

标签: html css

我是HTML和CSS的新手,我想知道流内容和短语内容之间的区别。除了W3官方文档之外,MDN文档也很有用,并声明:

流量内容定义如下:

  

属于流内容类别的元素通常包含文本   或嵌入的内容。

短语内容定义如下:

  

短语内容定义文本及其包含的标记。运行   短语内容构成段落。

然而,文档在两者之间几乎没有区别,有人可以澄清措辞内容和流内容之间的主要区别吗?

4 个答案:

答案 0 :(得分:32)

最容易记住的方法是,如果它可以在一个句子中,那就是它的内容。

文字可以在一个句子里面,所以它是短语。

强调位可以在一个句子中,所以它是短语。

句子中的图像可以是,所以它是短语。

子标题或文章不能在句子中,因此它们不是短语。

link可以在一个句子中,所以它是短语。但是从HTML 5开始,还允许一个包含整个文本块的链接,在这种情况下它不是短语。

短语内容分为三类:

  1. 内容被视觉上的东西取代。 (例如,<img>被图像取代。
  2. 包含运行中文本的内容。
  3. 提供有关运行中特定文本的元数据的内容。 (例如,<link>itemprop一起使用,而不是<link> <head>,它定义了整个文档与链接资源之间的关系。
  4. 流量内容包括短语内容,但也包括<p><h1等元素。它定义了整个文本行,<article>包含一个或多个运行,<table>包含包含文本行的单元格行。

      

    高级CSS非常关键,要知道不同类型的内容,而不仅仅是它的定义,或者只是某种类型内容下的元素列表,还有“为什么”某个元素属于某个类别和类似内容类别之间的主要区别,就我的问题而言,“阶段内容”和“流内容”之间的区别是什么。

    我不完全同意。

    基本HTML绝对至关重要来了解这一点。在文本编辑器中编写<html><head><title>Hello</title></head><body><p>Hello World!</p></body></html>并在浏览器中打开它之后,这是HTML中应该首先教授的内容,并且“HTML中有几个不同的元素”。它可能不会完全清楚,直到一个人学会了每个元素作为每个元素的例子,但让一个人围绕它是很重要的,因为许多事情只是没有意义,否则它会使简单的标记语言与容易记住的元素和属性以及标签的混乱汤,你永远不会记得为什么验证者说你做错了。

    现在肯定,你的CSS通常会遵循你的语义,并且默认值也来自它们(大多数可见的短语内容是替换元素或display: inline;,大多数其他流内容是{{1}或者与语义非常明显相关的东西(例如display: block;)。

    但是因为HTML是您首先考虑语义的地方,所以在编写CSS时,您可以更多地关注渲染,并在某种程度上从这种关注中解脱出来。当然,正确的语义通常不应该成为CSS的限制,除了你显然想要一个可以帮助你传达信息的视觉设计的简单事实。

    因此,例如,仅仅因为tr: {display: table-row;}被定义为“一个段落”而在我们的文化中段落今天通常被排版为文本块,它们之间有垂直边距或第一行有缩进,并不意味着我们必须遵循这一规则。我们可以用像here那样的晚间媒体风格来布置我们的段落,其中段落由朝圣者分开。

    并非你可能想要这样做,但你当然可以。因此,虽然优秀的CSS确实建立在元素的语义上,但它也使我们从它们中解放出来,因为我们不必有不正确的语义来获得我们想要的外观(或声音)。

答案 1 :(得分:6)

我认为这可以被视为关于短语内容的要点:

  

短语内容是文档的文本,以及在段落内标记文本的元素。短语内容的运行形成段落。

(由我突出显示。)

短语内容主要是你(可能/会)放入段落的内容。对于页面中较长部分的文本内容,大多数文本内容通常应组织成段落。段落是构建文本内容的最基本级别,与书籍或类似书籍中的传统书面文本相同。

流量内容是一个更广泛的类别。正如您在维恩图on the MDN page中所看到的,它包含所有其他类别的内容(元数据除外,显示为部分在其外部) - 这是有道理的,因为很多元数据都有进入head元素。)

所以措辞内容主要是段内级别,而流内容基本上是你想要直接放在body内的任何内容,或任何“更大”的结构元素。

您会看到list of elements for flow contentlist of elements for phrasing content重叠在一起 - f.e.两者都包含aimginputlabelspan等元素。您可能希望将所有这些元素放入{{1}段落是有充分理由的,但它们也可能是p的子项直接,或嵌套到其他元素中,例如(非)有序列表中的body链接,用于标记导航列表,a是站点徽标(因此不是段落的一部分),等等。所以很多东西都可以在段落内部以及它们之外 - 具体取决于具体的他们标记的内容的含义。

表示内容不包含但仅包含流内容的一部分的元素是段落中不允许的元素 - img本身当然是不同的标题级别psectionarticleasidedivformfooterfieldset等。您也可以将这些称为主要的,“顶级”结构元素。

如果您熟悉内联 vs 元素的“旧”HTML 4.01分类,那么这不应该带来太多麻烦。段落中允许大多数内联分类,而段落中不允许使用其他块元素。 (当然HTML 5添加了一些新元素,因此它们不是inline或block之前的部分。)

我主要使用段落来指出这一点,但同样适用于标题元素。这些也只允许在HTML 4.01中包含内联元素 - 现在他们的内容模型也是短语内容。将tabledivfooter或段落放在标题中是没有意义的;把链接或图像放在那里然而在很多情况下很容易理解。

当然,这种“涓滴”也是如此。对于诸如table(随机示例)之类的元素,内容模型也是短语内容。否则就没有意义 - 对于一个段落中的em元素,突然允许段落本身不允许包含的元素,根本不是明智的。

em元素在HTML 5中得到了一些特殊处理。以前只允许包含内联元素,它现在可以包含短语内容和流内容 - fe a包含允许a或段落。当然,这取决于上下文 - 如果div本身是一个只允许表达内容的元素的祖先,那么它本身也只能包含短语内容。是因为开发人员要求能够使用更大的结构化内容部分链接到其他地方 - fe,你可能想要一个包含标题的链接以及其中一些额外的[段落]文本。在HTML 5之前,人们不得不“假”这使用链接中的内联元素并通过CSS格式化它们看起来像标题和段落。)

因此,尽管HTML 5将块和内联的两个基本类别分解为几个类别,但流量和措辞内容仍是其中两个最重要的内容,我认为,可以说是“继承者”阻止和内联到一定程度。

如果有疑问,总会有规范来查看内容;并且validator将告诉您是否以不允许的方式嵌套元素。我建议你总是使用这个工具检查你的页面 - 随着时间的推移,所有这一切都会更自然地来自。

答案 2 :(得分:2)

这些类别是在尝试为标记赋予语义含义时进行的,以便最好地描述其中的内容。

短语内容定义文本及其包含的标记,是流内容的子类别,但还有其他子组headers和{ {1}} ...

即使它不是非常具有描述性,文档也会提供属于相应类别的元素的确切列表。

答案 3 :(得分:2)

PHRASING CONTENT

短语内容由文本内容,嵌入内容元素和短语元素组成,可能散布着HTML注释和/或空格。

允许在HTML代码中使用这些HTML元素,其中包含预期的流内容或预期的短语内容,在特定情况下可能存在一些限制。

流量内容

HTML中的流内容由流元素,短语内容和文本内容组成,可能散布在HTML注释和/或空格中。

流内容限制仅在允许流内容的情况下使用的元素 这些HTML元素只能在允许流内容的HTML代码中使用,在特定情况下还有一些额外的限制。此外,在预期流内容的情况下,也可以使用分类为措辞内容的文本和HTML元素。