HTML文档基础
一.HTML(Hyper Text Markup Language超文本标记语言)是一种用来制作超文本文档的简单标记语言,HTML在正文的文本中编写各种标记,通过Web浏览器进行编译和运行才干正确显示。此篇文章主要介绍HTML文档基础和经常使用标记,此篇文章的内容框架例如以下,可是仅仅先介绍HTML文档基础:
watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast" style="width:485px; height:309px">
上图在HTML文档的经常使用标记中。少画了一个多媒体标记,请见谅!
1.HTML文档基础:
1.1 HTML标记:HTML是超文本标记语言。
主要由文本和标记两部分构成。HTML的标记一般是由“<”、“>”以及当中所包括的标记元素组成的。
比如:<body></body>就是一对标记。此标记称为主体标记,用来指明文档中的主体内容。
(1).在HTML超文本标记语言中。大多数标记都是成对出现的。通常是由一个開始标记和一个结束标记组成的,当中開始标记告诉Web浏览器从此处開始运行该标记所表示的功能,而结束标记告诉Web浏览器在这里结束该功能。这类标记称为“双标记”,其语法格式例如以下:
<标记>内容</标记>
当中“内容”部分就是要被这对标记起作用的部分。比如在页面中输出y的平方。能够通过<sup></sup>标记来实现。
(2).接着附上一个“双标记”的样例。启动Dreamweaver CS5工具,也能够用其他编写网页的工具。在创建新项目中选择HTML,在“代码”窗体中编写例如以下代码:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>输出y的平方</title>
</head> <body>
输出y的平方:y<sup>2</sup>
</body>
</html>
接着新建一个网站,点击工具栏的网站,然后这样选择:
然后将这个网页保存到这个网站里,名字改为sup.html。执行效果例如以下:
(3).尽管在HTML超文本标记语言中。大多数的标记为“双标记”,可是也有一些是以单独形式存在的标记,此类标记称为“单标记”。这类标记仅仅需单独使用就能完整地表达其意思,语法格式为:<标记>
在HTML超文本标记语言中。最经常使用的“单标记”是<br>,此标记为换行标记。事实上写成<br/>也能够达到换行的效果。
(4).接下来附上一个“单标记”的样例,通常在页面中用一行显示一段文字,因为此行文字太长显得页面非常不美观,此时能够使用单标记<br>将此段文字分为两行显示。代码例如以下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>单标记</title>
</head> <body>
梦想遥不可及。可是不可放弃<br>仅仅要再坚持一下。成功的路就在脚下!
</body>
</html>
然后依然保存到那个JavaScript网站下,改为br.html,执行后例如以下:
watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast">
(5).在使用大多数单标记和双标记的開始标记内通常能够包括一些属性。其语法格式为:<标记 属性1 属性2 属性3...>
在上面的语法中,全部属性必须在開始标记的尖括号“<”中编写,各属性之间用空格分隔,无先后次序之分。属性也能够省略(即取其默认值)。
属性值须要使用英文半角双引號("")标注。
(6).接下来附上一个标记中带属性的样例,使用单标记<HR>在页面中画一条水平线,并设置其size属性、noshade属性、width属性和color属性,代码例如以下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>绘制一条水平线</title>
</head> <body>
<hr size="6" noshade="noshade" width="70%" color="#CCFF55">
</body>
</html>
当中代码中的size属性表示水平线的粗细。noshade属性表示将水平线的阴影去掉。水平线默觉得空心带阴影的立体效果,width属性表示水平线的宽度,color属性表示水平线的颜色。
保存此文件到网站上,文件名称改为br.html。执行效果例如以下:
watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast">
1.2 HTML文档的基本结构:使用HTML语言编写的超文本文件称为HTML文件。
能够在Windows下的文本编辑器中手工直接编写HTML文件,也能够使用FrontPage、Dreamweaver等可视化编辑软件编写HTML文档。
(1).在HTML超文本标记语言中。定义了3种标记用于描写叙述页面的基本结构。HTML中的基本结构例如以下:
<html>
<head>
...头部信息
<body>
...主体内容
</body>
</head>
</html>
(2).以下具体介绍各种标记的功能及使用方法:
— <html>...</html>标记:HTML文档中的第一个标记,该标记用于表示该文档是HTML文档。当浏览器遇到<html>标记时,就会按HTML的标准来解释文本。
结束标记</html>出如今HTML文档的尾部。
— <head>...</head>标记:此标记出如今<html>标记内起始的部分,此标记称为头部标记。
头部标记用于提供与Web页面有关的各种信息。在头部标记中,能够使用<meta>标记模拟HTTP协议的响应头报文,用于鉴别作者、标注内容提要和keyword、设定页面字符集、刷新页面等,在HTML头部能够包含随意数量的<meta>标记;使用<title>...</title>标记来指定网页的标题;使用<style>...</style>标记来定义CSS样式表;使用<script>...</script>标记来插入脚本语言等。
一般来说,位于头部标记中的内容都不会在网页上直接显示。
— <body>...</body>标记:此标记称为主体标记,在头部标记</head>之后。它定义了HTML文件显示的主要内容和显示格式。
作为网页的主体部分,此标记有非常多内置属性,这些属性用于设定网页的整体风格。比如,定义页面的背景图像、背景颜色、文字颜色以及超文本链接颜色等。
(3).接下来附上一个使用<font>...</font>标记的样例,<font>标记应用于HTML文件的主体标记<body>与</body>之间,而且仅仅影响它所标识的文字。
这里样例通过<font>标记的face属性定义字体为“黑体”,通过size属性定义大小为“16px”,通过color定义颜色为蓝色,代码例如以下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>定义文字字体</title>
</head> <body>
应用<font>标记来定义文字字体:
<br>
<font face="黑体,宋体" size="16px" color="#3399FF">蓝色的天空下。让我们一起飞翔。</font>
</body>
</html>
保存此文件为font.html到网站下。执行后例如以下:
这个样例中,使用了<和>来输出"<"和">"这些符号。即在HTML中为一些特殊的字符设置了特殊的代码。字符的实体名称都以一个“&”符号開始,以一个“;”符号结束。在这个样例代码中,,特殊符号“<”用<标记表示。特殊符号“>”用>标记表示。
当中还有非常多特殊的代码。如 代表空格,"代表英文半角的""双引號等等。
二.此篇文章介绍了HTML文档的基础,HTML文档的经常使用标记下次再介绍了,以上内容仅供大家学习參考,写得不好,请见谅,如有错误。请指出,谢谢。
HTML文档的经常使用标记介绍可看这篇文章:http://blog.csdn.net/u012561176/article/details/46956033,里面包括了这篇文章的代码的下载地址。
HTML文档基础的更多相关文章
- Excelize 发布 2.6.0 版本,功能强大的 Excel 文档基础库
Excelize 是 Go 语言编写的用于操作 Office Excel 文档基础库,基于 ECMA-376,ISO/IEC 29500 国际标准.可以使用它来读取.写入由 Microsoft Exc ...
- Excelize 2.3.2 发布,Go 语言 Excel 文档基础库,2021 年首个更新
Excelize 是 Go 语言编写的用于操作 Office Excel 文档基础库,基于 ECMA-376,ISO/IEC 29500 国际标准.可以使用它来读取.写入由 Microsoft Exc ...
- Excelize 2.3.1 发布,Go 语言 Excel 文档基础库,支持加密表格文档
Excelize 是 Go 语言编写的用于操作 Office Excel 文档基础库,基于 ECMA-376,ISO/IEC 29500 国际标准.可以使用它来读取.写入由 Microsoft Exc ...
- Excelize 发布 2.3.0 版本, Go 语言 Excel 文档基础库
Excelize 是 Go 语言编写的用于操作 Office Excel 文档基础库,基于 ECMA-376,ISO/IEC 29500 国际标准.可以使用它来读取.写入由 Microsoft Exc ...
- Excelize 发布 2.2.0 版本, Go 语言 Excel 文档基础库
Excelize 是 Go 语言编写的用于操作 Office Excel 文档基础库,基于 ECMA-376,ISO/IEC 29500 国际标准.可以使用它来读取.写入由 Microsoft Exc ...
- Mongoose学习参考文档——基础篇
Mongoose学习参考文档 前言:本学习参考文档仅供参考,如有问题,师请雅正 一.快速通道 1.1 名词解释 Schema : 一种以文件形式存储的数据库模型骨架,不具备数据库的操作能力 Model ...
- C#操作XML文档---基础
增查改删代码如下 public void CreateXML() { XmlDocument xml = new XmlDocument(); xml.AppendChild(xml.CreateXm ...
- XWPFDocument创建和读取Office Word文档基础篇(一)
注:有不正确的地方还望大神能够指出,抱拳了 老铁! 参考API:http://poi.apache.org/apidocs/org/apache/poi/xwpf/usermodel/XWPFDo ...
- Ehcache 3.7文档—基础篇—XML Configuration
你可以使用xml配置创建CacheManager,根据这个schema definition ( http://www.ehcache.org/documentation/3.7/xsds.html# ...
随机推荐
- 设计模式——“signleton”
那天别人问了我一个问题,关于单例模式的,由于之前了解的都是蜻蜓点水,所以重新复习了一次重新总结. 单例模式的写法总的来说有5种:懒汉,恶汉,枚举,双重校验锁,静态内部类 懒汉 public class ...
- mysql自动增长的有关问题,怎么恢复从1开始
mysql自动增长的问题,如何恢复从1开始在一个表中我设置到autoid为自动增长列例如有如下数据 1 张三 男 202 王五 男 223 李四 男 254 陈大 男 19 现在我把 autoid=3 ...
- R语言图表
条形图 在R语言中创建条形图的基本语法是 barplot(H, xlab, ylab, main, names.arg, col) H是包含在条形图中使用的数值的向量或矩阵 xlab是x轴的标签 yl ...
- CAD在网页绘一个直线,得到直线id,再调该得到直线对象,然写扩展数据
IMxDrawDatabase::ObjectIdToObject 实体id返回实体对象. 参数 说明 [in] LONGLONG lId 实体id JS代码,中绘一个直线,得到直线id,再调该得到直 ...
- Git学习总结二(版本回退)
修改修改仓库中readme.txt文件,然后用git status命令看看结果: $ git status On branch master Changes not staged for commit ...
- js的三种对象
JS中,可以将对象分为“内部对象”.“宿主对象”和“自定义对象”三种. 1,内部对象 js中的内部对象包括Array.Boolean.Date.Function.Global.Math.Number. ...
- 面试bb
1.面试者进行自我介绍 2.学校/学历/大学生活及课程的心得总结(人品,性格评估) 3.技能介绍(是否对应聘工作有帮助,评估学习能力):编程/操作系统/测试工具/测试方法/脚本 4.离职原因/项目经验 ...
- git连接github mac
话不多说,终端里的代码直接复制过来 Last login: Fri May 17 21:45:31 on ttys000 liuduoduodeMacBook-Air:~ liuxiangyang$ ...
- OI数学知识清单
OI常用的数学知识总结 本文持续更新…… 总结一下OI中的玄学知识 先列个单子,(from秦神 数论 模意义下的基本运算和欧拉定理 筛素数和判定素数欧几里得算法及其扩展[finish] 数论函数和莫比 ...
- Ubuntu_linux系统与网络服务管理
1.远程telnet联机:telnetd: 2.远程加密ssh联机:openssh: 3.webmin远程联机:webmin: 3.VNC远程图像界面控制:vino: 4.NAT网关服务器:iptab ...