极速中文HTML教程：入门到精通

需积分: 5 6 浏览量更新于2024-07-07 收藏 1.74MB PDF 举报

"这是一份极速中文HTML教程，适合初学者入门和作为参考手册。教程介绍了HTML语言的基础知识，包括HTML的起源、版本发展以及在网页开发中的角色。HTML是超文本标记语言，由蒂姆·伯纳斯-李发明，主要负责定义网页结构和内容，并支持超链接功能。现代网页开发的三大技术——HTML、CSS和JavaScript中，HTML是基础。教程还提供了简单的HTML代码示例，教导如何创建和查看网页源代码，以及理解HTML中的标签结构。" HTML（HyperText Markup Language）是构建网页的核心语言，定义了网页的结构和内容。HTML4.01曾是广泛接受的标准，而HTML5是目前最新的版本，包含更多增强功能。在网页开发中，HTML与CSS（层叠样式表）和JavaScript一起工作，HTML负责内容，CSS负责样式，JavaScript则用于交互。学习HTML时，关键在于理解和运用各种标签。标签是HTML代码的基本元素，通常成对出现，如`<抬头>`和`</抬头>`。这些标签告诉浏览器如何解析和显示内容。例如，`<html>`表示文档的开始，`<meta>`用于设置元数据，`<head>`包含了页面的元信息，如字符集设置，`<title>`定义了网页标题，`<body>`包含了网页的主要内容，而`<段>`（或`<p>`）用于创建段落。一个简单的HTML网页示例如下： ```html <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <title>网页标题</title> </head> <body> <p>你好，yoyo</p> </body> </html> ``` 这个例子展示了基本的HTML结构，包括文档声明`<!DOCTYPE html>`，定义语言属性`lang`，设置字符集`charset`，以及创建标题和段落。将这段代码保存为`.z.html`文件，然后转换为`.html`，通过浏览器打开即可看到效果。浏览器的“查看网页源代码”功能，允许用户查看任何网页的HTML源码，这对于学习和调试非常有用。通过阅读和分析源代码，可以了解不同标签如何组合以构建复杂的网页结构。本教程旨在提供全面的HTML知识，不仅适合初学者快速入门，也适合作为开发者随时查阅的参考。它基于网道HTML教程改编，并尊重原作者权益，如有侵权会及时处理。通过深入学习和实践，读者将掌握HTML语言，为网页开发打下坚实基础。

快捷键

快捷键属性指定网页元素获得焦点的快捷键，该属性的值必须是单个的可打印字符。只要按下快捷键，

该元素就会得到焦点。

上面代码中， <按钮> 的快捷键是 s ，按下快捷键，该元素就得到了焦点。

快捷键属性的字符键，必须配合功能键，一起按下才会生效。也就是说，快捷键是“功能键 + 字符键”的

组合。不同的浏览器与不同的操作系统，功能键都不一样。比如，Chrome 浏览器在 Windows 系统和

Linux 系统的快捷键是 Alt + 字符键，在 Mac 系统的快捷键是 Ctrl + Alt + 字符键。

注意，快捷键如果跟操作系统或浏览器级别的快捷键有冲突，这时不会生效。

样式

样式属性用来指定当前元素的 CSS 样式。具体的设置，请看 CSS 教程。

上面代码指定文字颜色为红色。

隐藏

隐藏是一个布尔属性，表示当前的网页元素不再跟页面相关，因此浏览器不会渲染这个元素，所以就不

会在网页中看到它。

上面代码中，这个段元素不会出现在网页上。

注意，CSS 的可见性设置，高于隐藏属性。如果 CSS 设为该元素可见，隐藏属性将无效。

语言，方向

语言属性指定网页元素使用的语言。

上面代码中，第一个 <段> 的语言属性，表示使用英语，第二个 <段> 的语言属性，表示使用中文。

语言属性的值，必须符合 BCP47 的标准。下面是一些常见的语言代码。

zh：中文

zh-Hans：简体中文

zh-Hant：繁体中文

en：英语

en-US：美国英语

en-GB：英国英语

es：西班牙语

fr：法语

方向属性表示文字的阅读方向，有三个可能的值。

左至右：从左到右阅读，比如英语。

右至左：从右到左阅读，阿拉伯语、波斯语、希伯来语都属于这一类。

<按钮快捷键="s">提交</按钮>

<段样式="颜色: 红色;">你好</段>

<段隐藏>本句不会显示在页面上。</段>

<段语言="en">hello</段>

<段语言="zh">你好</段>

自动：浏览器根据内容的解析结果，自行决定。

内容可编辑

HTML 网页的内容默认是用户不能编辑，内容可编辑属性允许用户修改内容。它有两个可能的值。

真或空字符串：内容可以编辑

假：不可以编辑

上面代码中，鼠标单击句子，就可以进入编辑状态，用户可以改变句子的内容。当然，除非提交到服务

器，否则刷新页面还是显示原来的内容。

该属性是枚举属性，不是布尔属性，规范的写法是最好带上属性值。

拼写检查

浏览器一般会自带拼写检查功能，编辑内容时，拼错的单词下面会显示红色的波浪线。拼写检查属性就

表示，是否打开拼写检查。

它有两个可能的值。

真：打开拼写检查

假：关闭拼写检查

上面代码中， seperate 下面会有提示，表示拼错了。

注意，由于该属性只在编辑时生效，所以这个例子必须加上内容可编辑属性，表示本段内容可编辑。鼠

标单击就可以进入编辑状态，这时才会看到拼写提示。不可编辑的状态下，拼写错误是不提示显示的。

对于那些不可编辑的元素，该属性无效。

这个属性看上去像布尔属性，但是其实是枚举属性，所以最好不要省略它的值。如果没有指定这个属

性，浏览器将自行决定是否打开拼写检查。

数据-* 属性

数据-* 属性用于放置自定义数据。如果没有其他属性或元素合适放置数据，就可以放在数据-* 属性。

上面代码中，数据-提示用于放置链接的提示文字。

由于数据-* 属性只能通过极速 CSS 或 JS 利用，所以这里不做详细介绍了。下面是 CSS 的例子。

<段内容可编辑="真">鼠标点击，本句内容可修改。</段>

<段内容可编辑="真" 拼写检查="真">英语单词 separate 容易写错成 seperate。</段>

<超链接网址="#" 类="提示" 数据-提示="这是提示!">链接</超链接>

/* HTML 代码如下

<块数据-设备="手机">

仅在手机上显示的内容

</块>

块[数据-设备="手机"] {

显示:无;

}

/* HTML 代码如下

<块类="测试" 数据-内容="这是块元素的内容">测试</块>

剩余86页未读，继续阅读

oFengYuGang

粉丝: 0
资源: 20

极速中文HTML教程：入门到精通

云计算网络极速入门-混合云网络.pdf

极速中文CSS教程（基础部分预览）.pdf

pdfjs 360浏览器极速模式pdf部分字体丢失

极速pdf阅读器安装

百度极速版5.47.0.10

zeromq:云时代极速消息通信库 pdf

360极速浏览器下载

360极速浏览器 爬虫

@page对于360极速浏览器的极速模式是否有效？

360极速浏览器安装油猴

最新资源

360极速浏览器爬虫