b这一类的元素都是a的同级元素并且是a元素之后的就可以a:hover~b{....}
完美解决 ，经测试！
附上我自己的代码：
ul li a img:hover ~h3 {padding-bottom: 10px
color: #25AAFF!important
border-bottom: 2px solid #25AAFF
}
你可以让span相对于div来定位啊，这样就不用管input的长度和位置了。当然，input也要通过设置text-indent来给span腾出位置。下面是个简单的实现例子（为了方便，我用了内联的css，你可以改成外联的）：
<div style="position:relative"><input type="text" id="xj_zhanghao" class="xj_text" maxlength="16" style="text-indent:20px" placeholder="账号" onKeyUp="xjzhltishi()" onFocus="qcxjtishi()"/><span id="xjzhtishi" style="position:absolute left:3px top:3px width:14px padding:1px line-height:1 text-align:center background-color:red color:white font-size:11px border-radius:2px">99</span></div>
材料/工具：电脑、CSS3、HTML5、HBuilder、浏览器、截图工具
1、双击打开HBuilder编辑工具，新建静态页面position.html，修改title标签内的内容。
2、在<body></body>标签元素内插入一个<div></div>标签，设置其id属性值为pos。
3、利用ID选择器设置div元素宽度和高度都为300px，背景色为#666666，position为absolute。
4、保存代码并预览界面，发现页面展示的正方形边框在左上角。
5、修改top、left、margin和padding，让div元素垂直居中。
6、设置div标签元素border-radius和background渐变属性即可。
