span 的cdir_HTML 中的 span 标签标准用途是什么?

本文介绍了HTML中的SPAN标签,它本身不具备特定含义,但结合class、lang和dir等全局属性,可用于语义化和样式设置。SPAN常用于代码片段的标记,通过CSS进行颜色编码。HTML4将SPAN视为行内级容器,而HTML5则强调其在预期的短语内容(phrasing content)上下文中使用。短语内容是指文档的文本及其内联级别的标记,连续的短语内容形成段落。SPAN元素必须包含至少一个非空白文本节点或嵌入式内容作为后代。
摘要由CSDN通过智能技术生成

标记来语义化的

Suppose, for example, that we wanted to generate an HTML document based on a database of client information. Since HTML does not include elements that identify objects such as "client", "telephone number", "email address", etc., we use DIV and SPAN to achieve the desired structural and presentational effects. We might use the TABLE element as follows to structure the information:

Client information:Last name:Boyera

First name:Stephane

Tel:(212) 555-1212

Email:sb@foo.org

Client information:Last name:Lafon

First name:Yves

Tel:(617) 555-1212

Email:yves@coucou.com然后,在HTML5对于SPAN的文档定义中,

http://dev.w3.org/html5/spec/single-page.html#the-span-element

对于SPAN的定义显得简洁多了:The span element doesn't mean anything on its own, but can be useful when used together with the global attributes, e.g. class, lang, or dir. It represents its children.

In this example, a code fragment is marked up using span elements and class attributes so that its keywords and identifiers can be color-coded from CSS:

for (j = 0; j < 256; j++) {

i_t3 = (i_t3 & 0x1ffff) | (j << 17);

i_t6 = (((((((i_t3 >> 3) ^ i_t3) >> 1) ^ i_t3) >> 8) ^ i_t3) >> 5) & 0xff;

if (i_t6 == i_t1)

break;

}大意就是,SPAN元素它自己本身啥也不是,但是,它在结合诸如:class,lang,或者dir属性时,非常有用。它起到描述了(文档内容)的作用。(样式:class+css;内容语言:lang;dir:文字方向)

另外:回答下这个问题的标题下面的问题=.=

HTML 4.01关于包含元素的定义:意思就是一个行内级的容器……

HTML 5 的关于包含元素的定义:Contexts in which this element can be used:

Where phrasing content is expected.这里提到了个phrasing content 这个东西;而这个东西它介绍到:

Phrasing content is the text of the document, as well as elements that mark up that text at the intra-paragraph level. Runs of phrasing content form paragraphs.

各种标记看图。。或点这个链接http://dev.w3.org/html5/spec/single-page.html#phrasing-content

之后它总结了一条通用规则,意思是任何允许包含phrasing content的容器至少要有一个Text类型的儿子结点,并且不能是inter-element whitespace[注②];或者,它的儿子结点可以是embedded content[注③]…… (后面说的是del元素,与span无关,大概意思是del元素里的子元素不会被del的祖先认为是它的后代?意思是del的长辈不认del的后代吗= =)

As a general rule, elements whose content model allows any phrasing content should have either at least one descendant Text node that is not inter-element whitespace, or at least one descendant element node that is embedded content. For the purposes of this requirement, nodes that are descendants of del elements must not be counted as contributing to the ancestors of the del element.

Most elements that are categorized as phrasing content can only contain elements that are themselves categorized as phrasing content, not any flow content.注②:inter-element whitespace :1. 内容为空的text结点 2.由space characters构成的text结点 , 这两类text结点会被认为是inter-element whitespace (space characters大致就是实现 space 键,tab键等功能的特殊字符)

The space characters are always allowed between elements. User agents represent these characters between elements in the source markup as text nodes in the DOM. Empty text nodes and text nodes consisting of just sequences of those characters are considered inter-element whitespace. The space characters, for the purposes of this specification, are U+0020 SPACE, U+0009 CHARACTER TABULATION (tab), U+000A LINE FEED (LF), U+000C FORM FEED (FF), and U+000D CARRIAGE RETURN (CR).

注③:embedded content :顾名思义,嵌入式内容。Embedded content is content that imports another resource into the document, or content from another vocabulary that is inserted into the document.

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值