|
|
(未显示同一用户的5个中间版本) |
第1行: |
第1行: |
| [[Category:HTML教程|1]] | | [[Category:HTML教程|1]] |
|
| |
| 超文本标记语言(英语:'''H'''yperText '''M'''arkup '''L'''anguage,简称:HTML)是一种用于创建网页的标准标记语言。HTML是一种基础技术,常与CSS、JavaScript一起被众多网站用于设计网页、网页应用程序以及移动应用程序的用户界面。浏览器可以读取HTML文件,并将其渲染成可视化网页。 | | 超文本标记语言(英语:'''H'''yperText '''M'''arkup '''L'''anguage,简称:HTML)是一种用于创建网页的标准标记语言。HTML是一种基础技术,常与CSS、JavaScript一起被众多网站用于设计网页、网页应用程序以及移动应用程序的用户界面。浏览器可以读取HTML文件,并将其渲染成可视化网页。 |
|
| |
|
| == HTML 实例 == | | == HTML 实例 == |
| “试试看效果”可以打开在线编辑器,然后编辑 HTML 代码并查看结果:
| | “尝试一下”可以打开在线编辑器,然后编辑 HTML 代码并查看结果: |
| <sample title="" desc="" hererun="s1"> | | <sample title="" desc="" hererun="s1"> |
| <!DOCTYPE html> | | <!DOCTYPE html> |
第34行: |
第33行: |
| * <nowiki><p> 元素定义了一个段落</nowiki> | | * <nowiki><p> 元素定义了一个段落</nowiki> |
|
| |
|
| == HTML 元素 ==
| | {{HTML元素基本知识}} |
| HTML 元素由开始标签、内容和结束标签组成:
| | {{HTML页面基本结构}} |
| | |
| <syntaxhighlight lang="python" line>
| |
| <标签名> 内容在这里... </标签名>
| |
| | |
| </syntaxhighlight>
| |
| <blockquote>
| |
| <nowiki>
| |
| 一些 HTML 标签不需要内容(如 <br> 换行标签)。这些元素称为空元素。空元素没有结束标签!</nowiki>
| |
| </blockquote>
| |
| | |
| == HTML页面结构 ==
| |
| | |
| <html>
| |
| <div class="ws-grey" style="width:99%;border:1px solid grey;padding:3px;margin:0;"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;"><html>
| |
| </font></font><div style="width:90%;border:1px solid grey;padding:3px;margin:20px"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;"><head>
| |
| </font></font><div style="width:90%;border:1px solid grey;padding:5px;margin:20px"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;"><title>页面标题</title>
| |
| </font></font></div><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">
| |
| </head>
| |
| </font></font></div>
| |
| <div class="ws-grey" style="width:90%;border:1px solid grey;padding:3px;margin:20px;"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;"><body>
| |
| </font></font><div class="w3-white" style="width:90%;border:1px solid grey;padding:3px;margin:20px;">
| |
| <div style="width:90%;border:1px solid grey;padding:5px;margin:20px"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;"><h1>这是一个标题</h1></font></font></div>
| |
| <div style="width:90%;border:1px solid grey;padding:5px;margin:20px"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;"><p>这是一个段落。</p></font></font></div>
| |
| <div style="width:90%;border:1px solid grey;padding:5px;margin:20px"><font style="vertical-align: inherit;"><font style="vertical-align: inherit;"><p>这是另一段。</p></font></font></div>
| |
| </div><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">
| |
| </body>
| |
| </font></font></div><font style="vertical-align: inherit;"><font style="vertical-align: inherit;">
| |
| </html>
| |
| </font></font></div>
| |
| </html>
| |
超文本标记语言(英语:HyperText Markup Language,简称:HTML)是一种用于创建网页的标准标记语言。HTML是一种基础技术,常与CSS、JavaScript一起被众多网站用于设计网页、网页应用程序以及移动应用程序的用户界面。浏览器可以读取HTML文件,并将其渲染成可视化网页。
HTML 实例
“尝试一下”可以打开在线编辑器,然后编辑 HTML 代码并查看结果:
示例
<!DOCTYPE html>
<html>
<meta charset="utf-8">
<head>
<title>浏览器标签栏Tab显示标题</title>
</head>
<body>
<h1>大标题</h1>
<p>这里是一个段落文本</p>
</body>
</html>
HTML 文件后缀
后缀为.html,.htm 。你可以讲上面的实例保存为test.html然后记事本打开将内容贴进去,然后再右键使用浏览器打开。即可看见效果。
示例解释
- 声明定义<!DOCTYPE html>文档是 HTML5 文档
- <html>元素是 HTML 页面的根元素
- <head>元素包含有关 HTML 页面的元信息
- <title>元素指定 HTML 页面的标题(显示在浏览器的标题栏或页面的选项卡中)
- 元素定义了文档的<body>正文,是所有可见内容的容器,例如标题、段落、图像、超链接、表格、列表等。
- 该<h1>元素定义了一个大标题
- <p> 元素定义了一个段落
HTML 元素
HTML 元素由开始标签、内容和结束标签组成:
一些 HTML 标签不需要内容(如 <br> 换行标签)。这些元素称为空元素。空元素没有结束标签!
HTML页面结构
<html>
<head>
<title>页面标题</title>
</head>
<body>
<h1>这是一个标题</h1>
<p>这是一个段落。</p>
<p>这是另一段。</p>
</body>
</html>