Replaced and Nonreplaced Elements

Replaced and Nonreplaced Elements

摘自CSS The Definitive Guide

Although CSS depends on elements, not all elements are created equally. For exam‐ple, images and paragraphs are not the same type of element, nor are span and div . In CSS, elements generally take two forms: replaced and nonreplaced.

尽管CSS依赖elements，不是所有的elements被等同的创建。例如，images和paragraphs不是同一类型的element，也不是span和div。在CSS中，elements大体上以两种形式：replaced和nonreplaced

Replaced elements

Replaced elements are those where the element’s content is replaced by something that is not directly represented by document content. Probably the most familiar HTML example is the img element, which is replaced by an image file external to the docu‐ment itself. In fact, img has no actual content, as you can see in this simple example:

Replaced elements是这些element的内容被一些东西替代，而不是直接的呈现在document的内容上。或许比较熟悉的HTML例子就是img element,这个元素在document中由一个外部的image所代替。实际上，img没有实际的content

This markup fragment contains only an element name and an attribute. The element presents nothing unless you point it to some external content (in this case, an image specified by the src attribute). If you point to a valid image file, the image will be placed in the document. If not, it will either display nothing or the browser will show a “broken image” placeholder. Similarly, the input element is also replaced—by a radio button, checkbox, or text input box, depending on its type.

这个标记片段只有一个element的name属性。这个元素只有你指定了一个外部文件才会展示。如果你指向的是一个有效的image文件，这个image将会在document中被替换。如果不是，它不会显示任何东西，或者是展示一张broken image的占位符。同样的，input element也会被button,checkbox或者是一个text input box所替换，取决于它的类型

Nonreplaced elements

The majority of HTML elements are nonreplaced elements. This means that their con‐tent is presented by the user agent (generally a browser) inside a box generated by the element itself. For example, hi there is a nonreplaced element, and the text “hi there” will be displayed by the user agent. This is true of paragraphs, headings, table cells, lists, and almost everything else in HTML.

HTML中的elements大多数都是nonreplaced elements。这就意味着它们通过user agent内嵌一个由它们自身生成的box展示内容。例如，<span>hi there</span>是一个nonreplaced element，并且这个hi here由user agent呈现。这个同样适合paragraphs, headings, table cells, lists和HTML中的其他elements