HTML教程:SUB标记与SUP标记(上角标与下角标)

做网站时,如果要在网页上显示一条数学公式,其中有平方等上角也下角标.该如何实现呢.本文为大家介绍二个HTML标记:SUB标记与SUP标记.它们分别实现下标与上标

定义和用法:

<sub> 标签可定义下标文本。<sup> 可定义上标文本。都属于行内元素，默认比当前字体稍小。

话不多说,我们先来看看一个简单的例子

原代码如下所示:

<!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=gb2312" />
<title>html中的sub与sup标签-如何制作网站-www.web2bar.cn</title>
<style type="text/css">
* { font-size:12px; font-family:Tahoma}
</style>
</head>

<body>
<div>
这个标签是<sub>sub</sub>
这个标签是<sup>sup</sup>
</div>
</body>
</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=gb2312" />
<title>html中的sub与sup标签-如何制作网站-www.web2bar.cn</title>
<style type="text/css">
* { font-size:12px; font-family:Tahoma}
</style>
</head>

<body>
<div>
x<sub>1</sub>+y<sub>2</sub><sup>3</sup>=15
</div>
</body>
</html>

哈哈,是不是很简单呢.相信大家平时也很少用到这二个标记吧!