html css 添加上标

有两种方式:
一、添加上标元素
1、使用<sup>元素
1.1、HTML代码

<span>欢迎来到大谋博客<sup>热</sup></span>


1.2、CSS代码
无需CSS代码
1.3、效果图:
欢迎来到大谋博客

2、使用vertical-align的super值
2.1、HTML代码

<span>欢迎来到大谋博客<span class="hot">热</span></span>


2.2、CSS代码

.hot{vertical-align:super}


2.3、效果图:
欢迎来到大谋博客

二、使用after伪类实现
HTML代码

<div id="hotTxt"><span hotTag="热">欢迎来到大谋博客</span></div>


CSS代码

#hotTxt span:after{position: relative; top: -4px;  content: attr(hotTag);}


效果图:
欢迎来到大谋博客

简书

未经允许不得转载:大谋菠萝格 » html css 添加上标

打赏 收藏
分享到: +