1、打开Hbuilder编辑器，新建一个html空白文档，输入基本的结构，这里设置一个外围的div盒子，给外围的div高度宽度和背景颜色，文字包裹到span标签里，文字也设置一下颜色，按下Crtl+S保存一下：
2、此时可以在软件右侧的窗口可以看到效果：
3、把外围盒子的position属性设置为relative，span标签里的position属性设置为absolute，设置top、left、right、bottom的数值，此时在右侧的窗口就会发现文字的位置已经改变了：
估计你原先的结构：<div class="111">文字 下面内容 </div>
改后结构：
<div class="111"><span class="222">文字</span>下面内容 </div>
望采纳，请试试。
总的来说就是外面的要和里面的文字分开处理，，给文字加上一个类，，然后再定义
<!DOCTYPE html><html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
html, body, ul{margin: 0 padding: 0}
ul, li{list-style: none}
.box{width: 500px height: 30px margin: 100px auto background-color: lightcoral}
li{float: left width: 90px height: 30px text-align: center line-height: 30px margin: 0 5px}
li:hover{margin-top: -10px background-color: red border-radius: 10px}
</style>
</head>
<body>
<div class="box">
<ul>
<li>网站首页</li>
<li>关于我们</li>
<li>业务介绍</li>
<li>新闻动态</li>
<li>会员中心</li>
</ul>
</div>
</body>
</html>
代码是类似的小例子，请参考
