HTML elements and CSS

Transfer from https://www.w3school.com.cn/html/html_css.asp

HTML CSS

By using HTML4.0, all the formatting codes can be removed from the HTML document, and then moved into a separate style sheet.

Examples

HTML in style

This example demonstrates how to use the add <head> style information portion of the HTML format.

No underlined link

This example demonstrates how to use a style attribute do not underlined link.

A link to an external style sheet

This example demonstrates how <link> tag linked to an external style sheet.

How to Use Styles

When the browser reads a style sheet, it will follow this style sheet to format the document. There are three ways to insert a style sheet:

External style sheet

When the style needs to be applied to many pages when an external style sheet would be the ideal choice. Use an external style sheet, you can change a file to change the appearance of the entire site.

<head>

</head>

Internal style sheet

When a single file requires special style, you can use the internal style sheet. You can head by partially <style> tag defines internal style sheet.

<head>

body {background-color: red}

p {margin-left: 20px}

</style>

</head>

Inline style

When a particular style needs to be applied to the individual elements, you can use inline styles. The method of using the inline style is to use a style property associated Tags. Style attribute can contain any CSS property. The following example shows how to change the color of the paragraph and left margins.

This is a paragraph

Visit our CSS tutorial , learn more about style.

label	description
<style>	Definition of style definitions.
<link>	Define the resource references.
<div>	Definition of a section or region of the document (block level).
<span>	Or small area within the definition of the document line.
<font>	The provisions of the text font, font size, font color. Deprecated. Use styles.
<basefont>	The definition of the base font. Deprecated. Use styles.
<center>	The text is centered horizontally. Deprecated. Use styles.

Transfer from https://www.w3school.com.cn/html/html_elements.asp

HTML elements

HTML documents are defined by the HTML element.

HTML elements

HTML 元素指的是从开始标签（start tag）到结束标签（end tag）的所有代码。

开始标签	元素内容	结束标签
<p>	This is a paragraph	</p>
<a href="default.htm" >	This is a link	</a>
<br />

注释：开始标签常被称为开放标签（opening tag），结束标签常称为闭合标签（closing tag）。

HTML 元素语法

HTML 元素以开始标签起始
HTML 元素以结束标签终止
元素的内容是开始标签与结束标签之间的内容
某些 HTML 元素具有空内容（empty content）
空元素在开始标签中进行关闭（以开始标签的结束而结束）
大多数 HTML 元素可拥有属性

提示：您将在本教程的下一章中学习更多有关属性的内容。

嵌套的 HTML 元素

大多数 HTML 元素可以嵌套（可以包含其他 HTML 元素）。

HTML 文档由嵌套的 HTML 元素构成。

HTML 文档实例

<html>

<body>

This is my first paragraph.

</body>

</html>

上面的例子包含三个 HTML 元素。

HTML 实例解释

 元素：

This is my first paragraph.

这个 元素定义了 HTML 文档中的一个段落。

这个元素拥有一个开始标签 ，以及一个结束标签 。

元素内容是：This is my first paragraph。

<body> 元素：

<body>

This is my first paragraph.

</body>

<body> 元素定义了 HTML 文档的主体。

这个元素拥有一个开始标签 <body>，以及一个结束标签 </body>。

元素内容是另一个 HTML 元素（p 元素）。

<html> 元素：

<html>

<body>

This is my first paragraph.

</body>

</html>

<html> 元素定义了整个 HTML 文档。

这个元素拥有一个开始标签 <html>，以及一个结束标签 </html>。

元素内容是另一个 HTML 元素（body 元素）。

不要忘记结束标签

即使您忘记了使用结束标签，大多数浏览器也会正确地显示 HTML：

This is a paragraph

上面的例子在大多数浏览器中都没问题，但不要依赖这种做法。忘记使用结束标签会产生不可预料的结果或错误。

注释：未来的 HTML 版本不允许省略结束标签。

空的 HTML 元素

没有内容的 HTML 元素被称为空元素。空元素是在开始标签中关闭的。

is not closed empty element tag ( tag defines a line break).

In XHTML , XML , and future versions of HTML , all elements must be closed.

Adding a slash at the beginning of the label, such as , is the proper way to close empty elements, HTML , XHTML and XML accept this way.

Even are valid in all browsers, but using actually more long-term protection.

HTML Tip: Use lowercase tags

HTML tags are not case sensitive: is equivalent to . Many web sites use uppercase HTML tags.

W3School using lowercase tags because the World Wide Web Consortium ( the W3C ) in HTML 4 are recommended to use lower case, and in the future HTML (X) version of the mandatory use lowercase.

HTML elements and CSS

Guess you like