html解决图⽚⽂字并排显⽰最新解决⽅法
常⽤情况：
1 2 3 4<div>
<img src="images/demand.png">
<span>设置成功，请牢记新的登陆密码</span> </div>
  显⽰图⽚：
解决⽅法：
1 <div>
2    <img src="images/demand.png" >
3    <span>设置成功，请牢记新的登陆密码</span>
4 </div>
显⽰图⽚：
解决思路：
  1.利⽤inline的vertical-align:middle属性（注意：这个属性只对inline和inline-block有效，对block⽆效）
  2.后⾯的⽂字⽤inline元素包装起来，否则还是会错位
情况1：
1  <!--情况1-->
2    <div >
3        <img src="../修改密码/求教/images/yes_big.png">
4        设置成功，请牢记新的登陆密码
5    </div>
显⽰图⽚：
解决⽅法：
<!--情况1-->
<div >
<p >设置成功，请牢记新的登陆密码
</p>
</div>
改变后图⽚：
解决思路：1.设置外⾯容器的height和line-height。
2.把显⽰图⽚的容易变为inline-block。
3.将图⽚设置为背景，注意left center，padding-left:（图⽚的宽度）；在显⽰⽂字。
情况2：
代码
1  <!--情况2-->
2    <div>
3        <div >
4            <span >验证码：</span>
5            <div >
6                <input type="text" class="text" value="59秒后可重新发送" disabled>
7                <label><img  src="../修改密码/求教/images/yes.png"></label>
8                <label >验证码已发送!</label>
9            </div>
10        </div>
11    </div>
当前效果为：
修改后的代码：
1  <div>
2        <div >
3            <span >验证码：</span>
4            <div >
5                <input type="text" class="text" value="59秒后可重新发送" disabled>
6                <label ><img  src="images/yes.png"></label>
7                <label >验证码已发送!</label>
8            </div>
9        </div>
html图片展示特效
10    </div>
修改后的效果：
解决思路：1.设置外⾯容器的position:relative;
2.设置图⽚容器的position:absolute；并指明top：0px；
3.⼀定要记得margin-left；在图⽚的下⼀个标签，或者图⽚本⾝。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。