超文本标记语言(英文HyperText Markup Language,简称:HTML)是一种用于创建网页的标准标记语言!对于中文网页需要使用<meta charset='utf-8'>声明编码,否则会出现乱码。有些浏览器(如360浏览器)会设置GBK为默认编码,则你需要设置为<meta charset='gbk'>例子模板
<!DOCTYPE html><html><head><meta charset="utf-8"><title>HTML中文网(html.cn)</title></head><body> <h1>我的第一个标题</h1> <p>我的第一个段落。</p></body></html>
解析
<!DOCTYPE html> 声明为 HTML5 文档<html> 元素是 HTML 页面的根元素<head> 元素包含了文档的元(meta)数据,如 <meta charset="utf-8"> 定义网页编码格式为 utf-8。<title> 元素描述了文档的标题<body> 元素包含了可见的页面内容<h1> 元素定义一个大标题<p> 元素定义一个段落
什么是HTML?HTML 是用来描述网页的一种语言。HTML 指的是超文本标记语言:HyperText Markup LanguageHTML 不是一种编程语言,而是一种标记语言标记语言是一套标记标签 (markup tag)HTML 使用标记标签来描述网页HTML 文档包含了HTML 标签及文本内容HTML文档也叫做 web 页面HTML 标签HTML 标记标签通常被称为 HTML 标签 (HTML tag)。HTML 标签是由尖括号包围的关键词,比如 <html>HTML 标签通常是成对出现的,比如 <b> 和 </b>标签对中的第一个标签是开始标签,第二个标签是结束标签开始和结束标签也被称为开放标签和闭合标签<标签>内容</标签>HTML 元素“HTML 标签” 和 “HTML 元素” 通常都是描述同样的意思.但是严格来讲, 一个 HTML 元素包含了开始标签与结束标签,如下实例:HTML 元素:<p>这是一个段落。</p>HTML 头部元素头部元素包含关于文档的概要信息,也称为元信息(meta-information)。Meta 意为“关于某方面的信息”。可以这么说,元数据(meta-data)是关于数据的信息,而元信息是关于信息的信息。HTML <HEAD> 元素<head> 元素包含了所有的头部标签元素。在 元素中你可以插入脚本(scripts), 样式文件(CSS),及各种meta信息。可以添加在头部区域的元素标签为: <title>, <style>, <meta>, <link>, <script>, <noscript>, and <base>.HTML <TITLE> 元素<title> 标签定义了不同文档的标题。<title> 在 HTML/XHTML 文档中是必须的。<title> 元素:1.定义了浏览器工具栏的标题2.当网页添加到收藏夹时,显示在收藏夹中的标题3.显示在搜索引擎结果页面的标题HTML <BASE> 元素<base> 标签描述了基本的链接地址/链接目标,该标签作为HTML文档中所有的链接标签的默认链接:
<head><base href="http://www.html.cn/images/" target="_blank"></head>
HTML <LINK> 元素<link> 标签定义了文档与外部资源之间的关系。<link> 标签通常用于链接到样式表:
<head><link rel="stylesheet" type="text/css" href="mystyle.css"></head>
HTML <STYLE> 元素<style> 标签定义了HTML文档的样式文件引用地址.在<style> 元素中你也可以直接添加样式来渲染 HTML 文档:
<head><style type="text/css">body {background-color:yellow}p {color:blue}</style></head>
HTML <META> 元素meta标签描述了一些基本的元数据。<meta> 标签提供了元数据.元数据也不显示在页面上,但会被浏览器解析。META 元素通常用于指定网页的描述,关键词,文件的最后修改时间,作者,和其他元数据。元数据可以使用于浏览器(如何显示内容或重新加载页面),搜索引擎(关键词),或其他Web服务。<meta> 一般放置于 <head> 区域<META> 标签- 使用实例为搜索引擎定义关键词:<meta name="keywords" content="HTML, CSS, XML, XHTML, JavaScript">为网页定义描述内容:<meta name="description" content="免费 Web & 编程 教程">定义网页作者:<meta name="author" content="HTML">每30秒钟刷新当前页面:<meta http-equiv="refresh" content="30">HTML <SCRIPT> 元素<script>标签用于加载脚本文件,如: JavaScript。<script> 元素在以后的章节中会详细描述。HTML head 元素
标签描述<head>定义了文档的信息<title>定义了文档的标题<base>定义了页面链接标签的默认链接地址<link>定义了一个文档和外部资源之间的关系<meta>定义了HTML文档中的元数据<script>定义了客户端的脚本文件<style>定义了HTML文档的样式文件HTML 元素HTML元素指的是从开始标签(start tag)到结束标签(end tag)的所有代码。例:
开始标签元素内容结束标签<p>这是一个段落</p><a href="default.html">这是一个链接</a><br>换行说明:HTML 文档是由 HTML 元素定义的注:开始标签常被称为起始标签(opening tag),结束标签常称为闭合标签(closing tag)。元素语法HTML 元素以开始标签起始HTML 元素以结束标签终止元素的内容是开始标签与结束标签之间的内容某些 HTML 元素具有空内容(empty content)空元素在开始标签中进行关闭(以开始标签的结束而结束)大多数 HTML 元素可拥有属性注释: 您将在本教程的下一章中学习更多有关属性的内容。嵌套的 HTML 元素HTML 文档由嵌套的 HTML 元素构成。大多数 HTML 元素可以嵌套(可以包含其他 HTML 元素)。空元素没有内容的 HTML 元素被称为空元素。空元素是在开始标签中关闭的。<br> 就是没有关闭标签的空元素(<br> 标签定义换行)。在 XHTML、XML 以及未来版本的 HTML 中,所有元素都必须被关闭。在开始标签中添加斜杠,比如 <br />,是关闭空元素的正确方法,HTML、XHTML 和 XML 都接受这种方式。即使 <br> 在所有浏览器中都是有效的,但使用 <br /> 其实是更长远的保障。注释标签<!--...-->HTML注释标签<!--...-->用来在源文档中插入注释。注释不会在浏览器中显示。可使用注释对您的代码进行解释,这样做有助于您在以后的时间对代码的编辑。特别是代码量很大的情况下很有用标签定义及使用说明<!--...--> 注释标签用来在源文档中插入注释。注释不会在浏览器中显示。您可使用注释对您的代码进行解释,这样做有助于您在以后的时间对代码的编辑。特别是代码量很大的情况下很有用。您也可以在注释内容存储针对程序所定制的信息。在这种情况下,这些信息对用户是不可见的,但是对程序来说是可用的。一个好的习惯是把注释或样式元素放入注释文本中,这样就可避免不支持脚本或样式的老浏览器把它们显示为纯文本。
<script type="text/javascript"><!--function displayMsg(){ alert("Hello World!")}//--></script>
注释:命令行最后的两个正斜杠(//)是 JavaScript 注释符号。这确保了 JavaScript 不会执行 –> 标签。除了在源文档中有非常明显的作用外,许多 Web 服务器也利用注释来实现文档服务端软件特有的特性。这些服务器可以扫描文档,从传统的 HTML/XHTML 注释中找到特定的字符序列,然后再根据嵌在注释中的命令采取相应的动作。这些动作可能是简单地包括其他文件中的文本(即所谓的服务器端包含,server-inside include),也可能是复杂地执行其他命令去动态生成文档的内容。HTML 段落与文字标题在 HTML 文档中,标题很重要。标题(Heading)是通过 <h1> - <h6> 等标签进行定义的。其中<h1> 定义最大的标题,<h6> 定义最小的标题HTML中的标题标签通过<h1>-<h6>来设置,越往下标题越小段落在HTML中段落是通过p标签来定义的,它可以将HTML文档分割为若干段落部分。因为p标签是块级元素,所以浏览器会自动地在段落的前后添加空行。注意: 因为p标签是块级元素,所以浏览器会自动地在段落的前后添加空行我们可以通过<br/>标签来对段落进行换行如果希望在不产生一个新段落的情况下进行换行,就可以使用<br /> 标签,注意它是一个单标签。文本格式化HTML可定义很多供格式化输出的元素,例:使用标签 <b>(“bold”) 与 <i>(“italic”) 对输出的文本进行格式,从而显示粗体 或者 斜体示例:
<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>HTML教程(html.cn)</title> </head> <body><b>加粗文本</b><br><br><i>斜体文本</i><br><br><code>电脑自动输出</code><br><br>这是 <sub> 下标</sub> 和 <sup> 上标</sup></body></html>
HTML 文本格式化标签
标签描述<b>定义粗体文本<em>定义着重文字<i>定义斜体字<small>定义小号字<strong>定义加重语气<sub>定义下标字<sup>定义上标字<ins>定义插入字<del>定义删除字HTML”计算机输出”标签
标签描述<kbd>定义键盘码<samp>定义计算机代码样本<var>定义变量<pre>定义预格式文本<code>定义计算机代码HTML 引文,引用,及标签定义
标签描述<abbr>定义缩写<address>定义地址<bdo>定义文字方向<blockquote>定义长的引用<q>定义短的引用语<cite>定义引用、引证<dfn>定义一个定义项目区块大多数 HTML 元素被定义为块级元素或内联元素。块级元素在浏览器显示时,通常会以新行来开始(和结束);而内联元素则不会。HTML 区块元素可以通过 <div> 和 <span> 将 HTML 元素组合起来HTML块级元素块级元素在浏览器显示时,通常会以新行来开始和结束 - 例:<h1>, <p>, <ul>, <table>HTML内联元素内联元素在显示时通常不会以新行开始 - 例:<b>, <td>, <a>, <img>HTML <div> 元素HTML <div> 元素是块级元素,浏览器会在其前后显示折行 - 如果与 CSS 一同使用,<div> 元素可用于对大的内容块设置样式属性。 - <div> 元素的另一个常见的用途是文档布局HTML <span> 元素HTML <span> 元素是内联元素,可用作文本的容器 - 与 CSS 一同使用时,<span> 元素可用于为部分文本设置样式属性HTML字符实体在 HTML 中,某些字符是预留的,这些预留字符必须被替换为字符实体;而,一些在键盘上找不到的字符也可以使用字符实体来替换。HTML 实体在 HTML 中,某些字符是预留的。比如在 HTML 中不能使用小于号(<)和大于号(>)因为浏览器会误认为它们是标签,所以希望能正确地显示预留字符,我们必须在 HTML 源代码中使用字符实体(character entities)。字符实体类似这样&entity_name;或entity_number;HTML 字符实体不间断空格HTML 中的常用字符实体是不间断空格( )浏览器总是会截短 HTML 页面中的空格,如果需要在页面中增加空格的数量,需要使用 字符实体有用的字符实体
显示结果描述实体名称实体编码空格<小于号<<>大于号>>&和号&&“引号""‘撇号' (IE不支持)'¢分¢¢£镑££¥元¥¥€欧元€€§小节§§©版权©©®注册商标®®™商标™™×乘号××÷除号÷÷注意:实体名称对大小写敏感欢迎大家提议、分享、交流、共同学习进步
0 评论