html代码w3c,W3C HTML学习笔记（一）

HTML简介

HTML 不是一种编程语言,而是一种用来描述网页的超文本标记语言 ( HyperText Markup Language)。

HTML 使用标记标签来描述网页，HTML文档即网页(web 页面)。

日常使用的Web浏览器(如谷歌浏览器，Internet Explorer，Firefox，Safari)通过读取HTML文件，并根据HTML标签来决定如何显示HTML页面的内容给用户。

HTML元素

HTML 文档由 HTML 元素定义。

元素的内容是起始标签(opening tag)与闭合标签(closing tag)之间的内容。

某些 HTML 元素具有空内容(empty content)，空元素在开始标签中进行关闭(以开始标签的结束而结束)。

大多数 HTML 元素可拥有属性。

注意：

在 XHTML、XML 以及未来版本的 HTML 中，所有元素都必须被关闭。

关闭空元素的正确方法是在开始标签中添加斜杠，比如
，HTML、XHTML 和 XML 都接受这种方式。

HTML属性

属性是 HTML 元素提供的附加信息。

HTML 标签可以拥有属性。属性提供了有关 HTML 元素的更多的信息。

属性一般在开始标签内描述。

属性总是以名称/值对的形式出现，比如：name="value"。

属性和属性值对大小写不敏感，但推荐使用小写。

注意：

属性值应该始终被包括在引号内(单/双引号都可以)。

但如果属性值本身就含有双引号，那么就必须使用单引号。

例如：name='Game "of" Throne'

HTML标题

因为用户可以通过标题来快速浏览您的网页，所以在 HTML 文档结构中，标题是很重要的。

请确保将 HTML 标题

-

标签只用于标题。不要仅仅是为了生成粗体或大号的文本而使用标题。

搜索引擎使用标题为网页的结构和内容编制索引。

1到6号标题与1到6号字体逆序对应，比如1号字体对应6号标题，2号字体对应5号标题。

HTML段落

段落标签

浏览器会自动地在段落的前后添加空行。(

是块级元素)

如果希望在不产生一个新段落的情况下进行换行(新行)，请使用
标签。

在 HTML 代码中，无法通过添加额外的空格或换行来改变输出的效果。

当显示页面时，浏览器会移除源代码中多余的空格和空行。所有连续的空格或空行都会被显示为一个空格。

HTML样式

style属性用于改变 HTML 元素的样式。

请避免使用这些被废弃的标签和属性

标签

描述

定义居中的内容。

和

定义 HTML 字体。

和

定义删除线文本。

定义下划线文本。

属性

描述

align

定义文本的对齐方式。

bgcolor

定义背景颜色。

color

定义文本颜色。

对于以上这些标签和属性：请使用样式代替！

HTML格式化

HTML 可定义很多供格式化输出的元素，比如使用标签 ("bold") 与 ("italic") 对输出的文本进行格式, 如：粗体 or 斜体。

1. 文本格式化标签：

定义粗体文本。 定义加重语气。

定义大号字。 定义小号字。

定义斜体字。 定义着重文字。

^{定义上标字。 _{定义下标字。}}

定义插入字。 定义删除字。

为文本添加下划线。

通常标签 替换加粗标签 来使用, 替换 标签使用。

通常标签替换定义加删除线的文本定义标签 和 。

2. “计算机输出”标签：

定义计算机代码。定义计算机代码样本。

定义键盘码。 定义打字机代码。

定义变量。

定义预格式文本。

被包围在

 标签 元素中的文本通常会保留空格和换行符。而文本也会呈现为等宽字体。，，不赞成使用，使用 

代替。

 标签的一个常见应用就是用来表示计算机的源代码。

注意：

pre元素是块级元素，但是只能包含文本或行内元素。也就是说，任何常见的可以导致段落断开的块级元素标签都不能位于pre元素中。

eg: 标题

(

元素中的文本通常呈现为斜体,而且大多数浏览器会在

元素前后添加折行)

pre元素中允许的文本可以包含物理样式和基于内容的样式变化(W3C的HTML 教程延伸阅读：改变文本的外观和含义)，还有链接、图像和水平分隔线。当把其他标签，比如标签放到

块中时，就像放在HTML/XHTML文档的其他部分中一样即可。

制表符tab在

标签定义的块当中可以起到应有的作用，每个制表符占据8个字符的位置，但并不推荐使用tab，因为在不同的浏览器中，tab的表现形式各不相同。在用

标签格式化的文档段中使用空格，可以确保文本正确的水平位置。

如果您希望使用

 标签来定义计算机源代码，比如 HTML 源代码，请使用符号实体来表示特殊字符，比如 "& lt;" 代表 ""，"& amp;" 代表 "&"。 一般将

标签与标签结合起来使用，以获得更加精确的语义，用于标记页面中需要呈现的源代码。

文本显示格式笔记：

页面显示结果：文本显示为单行，超过部分···

html结构：

文本显示为单行,超过部分隐藏并使用省略号

修改 width 属性查看效果。

css样式：

div {

overflow:hidden;

text-overflow:ellipsis;

white-space:nowrap;

width:200px;

}

页面显示结果：

文本显示为两

行,超过部分···

html结构：

文本显示为两行,超过部分隐藏并使用省略号修改 width 属性查看效果。使用 display:-webkit-box; 让文本显示为多行(只有-webkit内核才有作用)。

css样式：

div {

display:-webkit-box;

text-overflow:ellipsis;

overflow:hidden;

width:100px;

-webkit-line-clamp: 2;

-webkit-box-orient:vertical;

}