简体   繁体   English

HTML中的标头标签需要段落标签吗?

[英]Paragraph tags necessary with header tags in HTML?

I am starting to learn HTML and in the lesson I am on it tells me to include text in the body with <p> paragraph tags. 我开始学习HTML,在本课程中,我告诉我在正文中包含<p>段落标签。 However, in a different section, it just tells me to put some text between <h1> tags and the result seems to be the same. 但是,在另一部分中,它只是告诉我在<h1>标记之间放置一些文本,结果似乎是相同的。 Are <p> tags necessary to include in between heading tags? <p>标记是否必须包含在标题标记之间?

Direct answer 直接回答

No, the <p> is not necessary inside heading. 不, <p>在标题内不是必需的。 Moreover, it must not be used there! 此外,不得在此处使用它!

According to both the HTML 4 DTD and HTML 5 content models , the p element cannot be used inside h1 and it cannot contain h1 either. 根据HTML 4 DTDHTML 5内容模型p元素不能在h1使用,也不能包含h1

References to specs 规范参考

In HTML 4, p element is defined as block-level and can contain only inline elements, the same holds for h1 element . 在HTML 4中, p元素定义为块级,并且只能包含内联元素, h1元素也是如此

In HTML 5 p element can be used in contexts where flow content is expected and can contain phrasing content . 在HTML 5中, p元素可用于需要流内容并且可以包含短语内容的上下文中。 The same holds for h1 element again. 再次适用于h1元素

Text 文本

Other answers mentioned “free text” – paragraph text not marked up a p element contents. 其他答案提到“自由文本” –未标记p元素内容的段落文本。 Text is categorized as both phrasing content and flow content in HTML 5 and it's nothing really special. 在HTML 5中, 文本既包含短语内容又包含流内容,这没什么特别的。 With HTML 4 I am not sure about this and I suspect that the spec does not say much about it. 对于HTML 4,我对此不太确定,我怀疑规范对此没有太多说明。

Being flow content means that text can be directly embedded in body as its content model is flow content. 作为流内容意味着文本可以直接嵌入body因为其内容模型是流内容。 In fact, text can be embedded virtually anywhere. 实际上,文本几乎可以嵌入任何地方。 Using p elements is necessary for styling and paragraph breaks as any sequence of whitespace normally collapses into one before being displayed. 使用p元素是样式和段落中断所必需的,因为任何空白序列通常在显示前都会折叠为一个。 But in some simple cases p need not be used, eg when the whole document is just a heading and one paragraph: 但是在某些简单情况下,无需使用p ,例如,当整个文档只是一个标题和一个段落时:

<!DOCTYPE html>
<title>Really minimalistic HTML 5 example</title>
<h1>Really minimalistic HTML 5 example</h1>
And that’s all, folks!

Looking for html , head and body tags? 寻找htmlheadbody标签吗? They are omitted ; 它们被省略 ; the elements still exist, though. 这些元素仍然存在。 But there is no p element. 但是没有p元素。 You can verify that in Firebug or by applying styles to body and p . 您可以在Firebug中或通过将样式应用于bodyp来验证这一点。 If you want “And that's all, folks!” to be a real p paragraph, just place <p> before “And”. 如果您希望“仅此而已,伙计们!”是真正的p段落,只需将<p>放在“ And”之前。 (Closing tag </p> can be omitted.) (结束标记</p>可以省略。)

How to think about HTML 如何思考HTML

As many people offer misleading advice on HTML, I want to point you in the right direction, as far as HTML understanding is concerned. 由于许多人对HTML提供了误导性的建议,因此,就HTML理解而言,我想为您指明正确的方向。

Element is not a tag. 元素不是标签。 Element is a unit of document structure. 元素是文档结构的单位。 Tag is a string that represents element in document source code. Tag是一个字符串,表示文档源代码中的元素。 Most elements need two tags (opening and closing one) to represent them. 大多数元素需要两个标签(打开和关闭一个)来表示它们。 Eg p element is usually represented by <p> opening tag, </p> closing tag and the text between those two. 例如, p元素通常由<p>开头标记, </p>结束标记以及这两者之间的文本表示。 The opening tag can also be eg <p style="color: red"> – a different tag for the same element. 开头标签也可以是例如<p style="color: red"> –同一元素的不同标签。 Opening tag lists element's attributes ( style attribute in this case). 打开标签会列出元素的属性(在这种情况下为style属性)。

HTML is used to mark up structure of a document. HTML用于标记文档的结构。 You can completely ignore that browsers can somehow display h1 in big bold font, with big margins. 您完全可以忽略浏览器可以某种方式以大胆的粗体显示h1并显示较大的边距。 CSS takes care of elements' presentation. CSS负责元素的表示。 JS takes care of element's behavior. JS负责元素的行为。

The important thing on h1 is it is a level 1 heading. h1上重要的是它是1级标题。 It has this meaning , these semantics . 它具有这些含义 ,这些语义 p , on the other hand, is paragraph (approximately; for details see my question on paragraphs in HTML ). 另一方面, p是段落(大约;有关详细信息,请参阅我关于HTML段落的问题 )。 It is natural that headings and paragraphs are two distinct components of a document and that they are used independently one of the other. 标题和段落是文档的两个截然不同的部分,它们彼此独立地使用是很自然的。 Using elements properly, respecting their defined semantics, is necessary for pretty display with styles switched off, SEO, browsing with screen readers and overall accessibility. 为了正确显示样式,关闭SEO,使用屏幕阅读器进行浏览以及整体可访问性,必须正确使用元素,并遵守其定义的语义。

h1 through h6 are header tags p is a paragraph tag. h1到h6是标题标签,p是段落标签。 will by default in most browsers display larger unless a reset of sorts is applied to it. 默认情况下,除非对其应用排序重置,否则大多数浏览器中的都会显示较大。

 <html>
<head>
<title>Hello World</title> 
</head>
<body>
<h1>Hello World</h1> 
<p>Some Text</p>

</body>
</head>

here is a jsfiddle so you can see http://jsfiddle.net/snymax/93TSp/ Edit http://jsfiddle.net/snymax/93TSp/1/ displays h1 - h6 p and free text. 这是一个jsfiddle,因此您可以看到http://jsfiddle.net/snymax/93TSp/ 编辑 http://jsfiddle.net/snymax/93TSp/1/显示h1-h6 p和自由文本。

Many of the HTML tags have some special meaning in terms of their display. 许多HTML标记在显示方面都有一些特殊的含义。 Block Level and Inline Level . 块级别内联级别 Block level elements are semantically defined t start with a new line. 块级元素在语义上定义为从新行开始。 Inline elements can share space within the same line. 内联元素可以在同一行内共享空间。 <h1> and <p> both are block level elements. <h1><p>都是块级元素。 General meaning of <h1> is a heading. <h1>一般含义是标题。 A bolder, bigger text. 更大胆的文字。 <p> tag used to put large text. <p>标记用于放置大文本。 say a description of some thing. 说一些事情的描述。 You are suggested to use them according to their meanings. 建议您根据其含义使用它们。 <span> is an example of an inline element . <span>内联元素的示例。 You should judge how to use them according to your requirement. 您应该根据自己的需求来判断如何使用它们。 The general idiom is you should only put Block level (and inline ones) in a block level element only and not in an Inline element . 一般的习惯用法是,您只应将“ 块级” (和内联 )放在“块级”元素中,而不应放在“ 内联”元素中 In a stricter note, some parsing environments other than browser ( like small device publishing formats ) throw errors if you do such things. 严格来说,如果您执行此类操作,则浏览器以外的某些解析环境(例如小型设备发布格式)会引发错误。

That said, it is all your will how you include them. 就是说,将它们包括在内是您的全部意愿。

For an advanced understanding : Mozilla's trusted documentation 深入了解: Mozilla的受信任文档

No, they are not - you can surround text with <h1> without <p> s. 不,它们不是-您可以使用<h1>包围文本而不使用<p>

Maybe you've been using some library that has a CSS rule that affects h1 p 也许您一直在使用一些具有影响h1 p的CSS规则的库

Nope. 不。

<html>
<head>
</head>
<body>
<h1> My header </h1>
<p> some paragraph </p>
FREE TEXT..  Doesn't need any tags... 
</body>
</html>

No 没有

are not necessary but can clean your displayed text. 不需要,但可以清除显示的文本。

<h1> its a header </h1>
<p> its a paragraph of text under that specific header</p>

and the result seems to be the same No it isn't! 结果似乎是一样的不,不是!

In HTML you can have text in many ways even without anything on the HTML, not even the <!DOCTYPE> tag! 在HTML中,即使HTML上没有任何内容,您也可以通过多种方式获得文本,甚至<!DOCTYPE>标记也没有!

The <p></p> is just a way of design to the HTML that includes a certain font and size. <p></p>只是对HTML进行设计的一种方法,其中包括一定的字体和大小。

So technically, you CAN have <p></p> within a <h1></h1> tag but it's not really needed, it make a bit of difference though. 因此,从技术上讲,您可以在<h1></h1>标记内包含<p></p> ,但这并不是真正需要的,尽管有所不同。

<p>
    <h1>
        This is Possible
    </h1>
</p>

<h1>
    <p>
        This is Possible
    </p>
</h1>

<p>
    This is Possible
</p>

<h1>
    This is Possible
</h1>

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM