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 添加上标

打赏 收藏
分享到: +

评论 3

换个身份

  • 昵称 (必填)
  • 邮箱 (选填)
  • 网址 (选填)
  1. #1
    大谋大大
    有留言,还不快点抢沙发?
    大谋大大 2017-09-13 00:40:58回复 取消评论