首页 > 其他分享 >CSS 添加上标

CSS 添加上标

时间:2023-08-29 16:22:05浏览次数:44  
标签:天天向上 HTML 代码 好好学习 添加 上标 CSS

CSS 添加上标


心彻IP属地: 浙江 2016.01.20 14:37:46字数 184阅读 10,017

有两种方式:
一、添加上标元素
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);}
效果图:
好好学习,天天向上热

参考:CSS参考手册

 

标签:天天向上,HTML,代码,好好学习,添加,上标,CSS
From: https://www.cnblogs.com/tomcat2022/p/17665180.html

相关文章

  • IDEA添加模块到工程
    好像不是模块?IDEA连接到sourcefolder?直接将src复制到src得了。。......
  • 嵌套添加
    /**@Author:[email protected]*@Date:2023-02-2114:29:17*@LastEditors:PleasesetLastEditors*@LastEditTime:2023-03-0909:48:22*@FilePath:\fisp-web\src\pages\demo\platform\sale\FixtureQuotation.tsx*@Description:这是默认设置,请......
  • Vue项目element-ui 添加动态校验
    需求:一个表单中某个字段,根据另一个字段变化,校验是否必填<el-formref="detail":model="detail":rules="ruleData"size="small"label-width="100px"><el-card><el-row><el-col:spa......
  • 基于Debian Docker镜像添加中文字体
    1.选择需要添加的中文字体到一个目录中。从Windows中拷贝出需要的字体即可,目录地址:C:\Windows\Fonts2.编辑Dockerfile,添加中文字体【以dotnet镜像为例,其基于Debian】FROMmcr.microsoft.com/dotnet/aspnet:6.0WORKDIR/appEXPOSE7777COPY/publish.COPY/Font/*/usr/sh......
  • 国标GB28181视频平台EasyGBS国标平台添加针对H.265视频流的告警信息的具体操作流程
    EasyGBS国标视频云服务支持设备/平台通过国标GB28181协议注册接入,可实现视频的实时监控直播、录像、检索与回看、语音对讲、云存储、告警、平台级联等功能。平台支持将接入的视频流进行全终端、全平台分发,分发的视频流包括RTSP、RTMP、FLV、HLS、WebRTC等格式。在EasyGBS平台中接入......
  • iTOP-i.MX8MM开发板添加RIL驱动程序库
    将Quectel提供的相应RIL库文件放入Android系统的以下路径。作者拷贝到了源码的android_build/device/fsl/imx8m/evk_8mm/lib目录下,如下图所示:然后将apns-conf.xml拷贝到android_build/device/fsl/imx8m/evk_8mm/下,如下图所示:......
  • 【Element】el-dialog 内使用 el-image 并添加 preview-src-list 预览,拖拽导致图片预
    现象el-dialog内使用el-image并添加preview-src-list预览,拖拽导致图片预览不完整<el-dialogwidth="500"v-model="visible":title="activeProp?.name"@close="handleClose":draggable="true"//可拖拽......
  • 国标GB28181视频平台EasyGBS国标平台添加针对H.265视频流的告警信息的具体操作流程
    EasyGBS国标视频云服务支持设备/平台通过国标GB28181协议注册接入,可实现视频的实时监控直播、录像、检索与回看、语音对讲、云存储、告警、平台级联等功能。平台支持将接入的视频流进行全终端、全平台分发,分发的视频流包括RTSP、RTMP、FLV、HLS、WebRTC等格式。 在E......
  • C# 在datatable中添加自定义字段
    DataTabledt=newDataTable();sql.Append("SELECTafromb");dt=SqlHelper.GetDataTable(sql.ToString());sql=newStringBuilder();sql.Append("SELECTcfromd");varjcdt=SqlHelper.GetDataTable(sql.ToString());......
  • vector 动态添加
    #include<iostream>#include<vector>#include<string>#include<algorithm>intmain(){std::vector<std::string>myVector;//创建一个空的vector<string>std::stringinput;std::cout<<"请输入字符串(输入exi......