今日来认识一下2个我不太常见到的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标签</title>
<style type="text/css">
* { font-size:12px; font-family:Tahoma}
</style>
</head>

<body>
<div>
这一标签是<sub>sub</sub>
这一标签是<sup>sup</sup>
</div>
</body>
</html>

html sub标记和sup标记 sup sub HTML HTML/Xhtml  第1张







举一反三:

大家讨论一下数学方程式这类实际效果如何完成?

html sub标记和sup标记 sup sub HTML HTML/Xhtml  第2张


 

 

<!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标签</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>

别的运用:

不经意的机遇 ,发觉前不久的淘宝在价钱上干了点装饰(不清楚是什么原因,如今又还原了),和之前传统式的价钱主要表现不一样 。

html sub标记和sup标记 sup sub HTML HTML/Xhtml  第3张

 

 









html sub标记和sup标记 sup sub HTML HTML/Xhtml  第4张





<!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标签</title>>
</head>
<style type="text/css">
<!--
body { font:12px/1.8 Tahoma}
span.price { font-family:Arial, Helvetica, sans-serif; font-size:16px; font-weight:700; color:red;}
span.price sub { vertical-align:baseline; font-size:12px;}
span.price sup { vertical-align:text-bottom; color:#555}
-->
</style>
<body>
<span class="price"><sup>¥</sup>43.<sub>26</sub></span>
</body>
</html>

坚信sub和sup标签的运用不仅限于此 ,别的html标签也这般,如果你了解了他们,启动大家的逻辑思维和想像 ,就可以娴熟的应用他们、呈现他们与众不同风采的一面。