如何覆盖<a>

Question

中链接的bootstrap col-md和其他属性

由于我发布了一张图片，我们可以看到由于引导属性，它在通过inspect元素看到时为链接分配了整个框

如何删除整个内容并且只保留文本所在的限制i，而不是分配整行，我希望该框在单词的最后一个字符处结束

任何帮助表示赞赏！ ：）

这是我的代码：

<footer class="text-left row foot-div bench">
    <div class="col-md-offset-1 col-md-2 col-sm-4 col-xs-6 wow fadeInUp" data-wow-duration="600ms" data-wow-delay="300ms">
    <div class="text-uppercase footer-main-title">Professional Bodies</div>
    <ul>
        <a href="http://www.ieindia.info" target="_blank"><li>IE</li></a>
        <a href="http://www.iete.org" target="_blank"><li>IETE</li></a>
        <a href="http://www.isteonline.in" target="_blank"><li>ISTE</li></a>
        <a href="http://www.csi-india.org" target="_blank"><li>CSI</li></a>
        <a href="http://www.ieee.org" target="_blank"><li>IEEE</li></a>
    </ul>
</div>
<div class="col-md-2 col-sm-4 col-xs-6 wow fadeInDown" data-wow-duration="600ms" data-wow-delay="300ms">
    <div class="text-uppercase footer-main-title">Campus Facilities</div>
    <ul>
        <a href="<?php echo $site_url;?>atm.html"><li>ATM</li></a>
        <a href="<?php echo $site_url;?>ghostel.html"><li>Girls Hostel</li></a>
        <a href="<?php echo $site_url;?>Newpdf/digipage.htm"><li>Digital Library</li></a>
        <a href="<?php echo $site_url;?>dispensary.html"><li>Medical Dispensary</li></a>
        <a href="<?php echo $site_url;?>sportgm.html"><li>Sports & Gymkhana</li></a>
        <a href="<?php echo $site_url;?>av.html"><li>Audio - Video Section</li></a>
    </ul>
</div>
<div class="col-md-2 col-sm-4 col-xs-6 wow fadeInUp" data-wow-duration="600ms" data-wow-delay="300ms">
    <div class="text-uppercase footer-main-title">Important Links</div>
    <ul>
        <a href="http://mail.sipnaengg.ac.in"><li>Mail Login</li></a>
        <a href="<?php echo $site_url;?>login.html"><li>HOD Login</li></a>
        <a href="http://www.dte.org.in" target="_blank"><li>DTE, Mumbai</li></a>
        <a href=""><li>T&P Feedback</li></a>
        <a href="" target="_blank"><li>AICTE, New Delhi</li></a>
        <a href="" target="_blank"><li>random data</li></a>
        <a href="<?php echo $site_url;?>spltp.html"><li>Training Programmes</li></a>
        <a href="<?php echo $site_url;?>ietebuild.html"><li>IETE Amravati Centre</li></a>
        <a href="<?php echo $site_url;?>wgs.html"><li>Women's Greivence Cell</li></a>
    </ul>
</div>
<div class="col-md-2 col-sm-4 col-xs-6 wow fadeInDown" data-wow-duration="600ms" data-wow-delay="300ms">
    <div class="text-uppercase footer-main-title">Student Activities</div>
    <ul>
        <a href="<?php echo $site_url;?>nss.html"><li>N.S.S</li></a>
        <a href="<?php echo $site_url;?>vidyotan.html"><li>Vidyotan</li></a>
        <a href="<?php echo $site_url;?>innovater.html"><li>Innovator</li></a>
        <a href="<?php echo $site_url;?>CSIchapter.html"><li>CSI Chapter</li></a>
        <a href="<?php echo $site_url;?>ETSO.html"><li>IETE Forum</li></a>
        <a href="<?php echo $site_url;?>natureclub"><li>Nature Club</li></a>
        <a href="<?php echo $site_url;?>sports.html"><li>Sports</li></a>
        <a href="<?php echo $site_url;?>newpdf/NewsMedia15/"><li>Newsmedia</li></a>
        <a href="<?php echo $site_url;?>newpdf/ISF/"><li>IETE Student Forum</li></a>
        <a href="<?php echo $site_url;?>IEEE/"><li>IEEE Student Chapter</li></a>
    </ul>
</div>
<div class="col-md-2 col-sm-4 col-xs-6 wow fadeInUp" data-wow-duration="600ms" data-wow-delay="300ms">
    <div class="text-uppercase footer-main-title">Downloads</div>
    <ul>
        <a href="<?php echo $site_url;?>Newpdf/Mand_Discl2015.pdf"><li>Mandatory Disclosure 2014-15</li></a>
        <a href="<?php echo $site_url;?>Newpdf/Documents.pdf"><li>AICTE-DTE Disc Certificates</li></a>
        <a href="<?php echo $site_url;?>parentmeet.html"><li>Parents Meet</li></a>
        <a href="<?php echo $site_url;?>photogallery_new15.htm"><li>Image Gallery</li></a>
        <a href="<?php echo $site_url;?>videogallery"><li>Video Gallery</li></a>
        <a href="<?php echo $site_url;?>msit.html"><li>Microsoft IT-Curriculum<br />Syllabus & Fee Structure</li></a>
    </ul>
</div>

css代码：

.foot-div
{
    padding: 5px;
}
.foot-div div div
{
    margin-top: 20px;
    color: #337ab7;
}
.foot-div div ul
{
    margin-top: 20px;
}
.foot-div div ul li
{
    list-style-type: square;
    font-size: 17px;
    font-weight: normal;
}
.foot-div div ul a
{
    color: #ffffff;
}
.foot-div div ul a:hover
{
    color: #2eb48f;
}

Answer 1

您的列表项目包含在链接中。尽量做相反的事情。包裹列表项中的每个链接。使用

<li><a href="">Text</a></li>

而不是

<a href=""><li>Text</li></a>