Html中发现a标签包含一个img标签，对齐方式没有居中问题

来源：互联网发布：算法初步ppt 编辑：程序博客网时间：2024/06/11 23:46

自己一直是搞后端开发的，偶然接手一个项目，自己制作了一个比较简单的html页面，发现了一个问题，a标签包含img标签后，对齐方式改变了，纳闷了许久，最终还是解决了。

<html>    <head>        <style type="text/css">            *{                margin: 0;                padding: 0;            }            ul{                list-style: none;            }            ul li{                float: left;                width: 200px;                margin-left: 100px;                margin-top: 70px;            }            .banner{                width: 100%;                height: 100px;                background-color: #DC483A;            }            .bannerOpt{                padding-top: 50px;                padding-right: 20px;            }            .bannerOpt a{                display: block;                   float: left;                   line-height: 35px;            }            .info{                width: 100%;                height: 35px;                background-color: #EAEAEA;                line-height: 35px;            }            .info_msg{                width: 95%;                margin: 0 auto;            }            .fl{                float: left;            }            .fr{                float: right;            }            /**把以下注释放开解决问题**/            /**.ann a {display: block;                   float: left;                   line-height: 35px;               }            .ann img{                float: left;                display: block;                padding: 0 6px;            }**/            .content{                width: 100%;                height: 80%;                background: #FAFAFA;            }            .content_msg{                width: 95%;                padding-top: 70px;            }        </style>    </head>    <body>        <div class="banner"></div>    <div class="info">        <div class="info_msg">            <span class="fl">赣州市党委账号&nbsp;&nbsp;&nbsp;${orgCode } 用户名：某某某</span> <span class="ann fr"><a><img src="xgmm.png">修改密码</a>&nbsp;&nbsp;&nbsp;<a href=""><img src="tcdl.png">退出登录</a></span>        </div>    </div>        <div class="content">            <div class="content_msg">                <ul>                    <li><a><img src="zzsh.png"></img><br/>组织管理</a></li>                    <li><a><img src="zzsh.png"></img><br/>内容发布管理</a></li>                    <li><a><img src="zzsh.png"></img><br/>账号管理</a></li>                    <li><a><img src="zzsh.png"></img><br/>组织生活管理</a></li>                    <li><a><img src="zzsh.png"></img><br/>党员生活管理</a></li>                    <li><a><img src="zzsh.png"></img><br/>通知公告发布</a></li>                    <li><a><img src="zzsh.png"></img><br/>待阅待办通知</a></li>                    <li><a><img src="zzsh.png"></img><br/>党员管理</a></li>                    <li><a><img src="zzsh.png"></img><br/>组织关系接转</a></li>                </ul>            </div>        </div>    </body></html>

阅读全文

0 0