关于前端:零基础教你学前端12文本修饰之其他标签

持续学习网页中用于文本润饰的其余标签。首先给文本增加下划线。还是来看百度新闻首页，右上角导航， 文本上面有一条润饰线，这条润饰线实质上就是一条下划线。

这个下划线通过 u 标签 来实现，  u 是英文单词： underline 的简写， 意为下划线 ， 它是一个双标签。u 标签的语法是： <u>文本</u> 外面搁置待润饰的文本 。

关上编辑器，新建文件，命名为 underline.html，补全根本构造， 在 body外面创立一个 u 标签，在 u 标签里输出：我是 u 标签，在浏览器中关上页面， 咱们看到，文本曾经增加了 下划线。

上面来学习角标的制作。这是百度天气的页面， 展现了北京近一周的天气，仔细观察发现： 单位摄氏度 (℃) 中的圆圈，在字母 C 的左上角。

再来看一个例子这是哈药集团官网的一个页面， (http://www.hayao.com/product/…)    咱们看到这里有个罗红霉素的分子式： 碳41， 氢76，氮2， 氧15， 原子的个数在元素的右下角显示。

这些非凡的角标如何制作呢？ 角标标签能够实现这个成果。 角标标签共有两类： 别离是 sup上角标，和 sub 下角标，英文单词 superscript 缩写   sub 是英文单词 subscript 缩写，它们是双标签。上角标标签的语法是:<sup>文本</sup>  下角标标签的语法是 :<sub>文本</sub>

回到编辑器，实现摄氏度的成果， 新建一个 sup.html 文件，补全根本构造， 在body中书写一段文本 （11○C ） 11摄氏度，如何让圆圈作为上角标显示呢？咱们在圆圈 (○) 后面补上一个 sup 标签， 选中圆圈 ，(○) 把圆圈 (○) 间接拖入到 sup 标签外部 保留。

在浏览器中关上，很分明的看到，11前面的圆圈 (○) 曾经显示为上角标了。回到编辑器， 咱们再来实现分子式成果， 新建一个 sub.html 文件， 补全根本代码，在 body 中书写一个 H2O， 水的分子式，在 2 的后面书写一个 sub 标签 ，选中数值2， 把 2 这个数字拖拽到 sub标签 外部 ， 保留。

浏览器中关上， 水分子式成果实现了。如果有一段文本，既有加粗款式，又有歪斜，还带有下划线咱们能够通过标签的嵌套来实现款式叠加的成果，嵌套的规定，相似于洋葱一样，一层包裹一层， 比方 b 标签，包裹 i 标签， i 标签包裹 u 标签，  层层嵌套，这里须要留神， 要整个标签包裹 ，   万万不能穿插嵌套。

回到编辑器 。 咱们就来实现一个既加粗又歪斜的文本成果。  新建一个nesting.html文件 ，  主动补全根本构造， 在 body 中书写一个 b 标签， 在 b 标签中书写一个 i 标签， 在 i 标签中书写文本，  这里实现的，就是既加粗又歪斜的成果，保留。

在浏览器中关上， 成果实现了。

文章配套视频链接