所有CSS样式都不适用于锚标记

时间：2018-05-03 03:30:11

标签： html css anchor

＆＃13;
＆＃13; 
 a{
       text-decoration:none !important;
    color:white !important;    
    }
    a:hover{
         text-decoration:none !important;
    }
    section #portfolio div.container div.row div.portfolio-item div.card div.card-body h4.card-title a{
        text-decoration:none;
        color:white ;
    }
       section #portfolio div.container div.row div.card-body h4.card-title a:hover{
        text-decoration:none;
        color:white ;
    }
   h4.card-title a:hover{
                text-decoration:none;
        color:white ;
    }
  a:hover{
                text-decoration:none;
        color:white ;
    }
    section#portfolio div.container div.row div.col-lg-4.col-sm-6.portfolio-item div.card.h-100 div.card-body h4.card-title a.link{
               text-decoration:none;
        color:white ; 
    }
    h4.card-title a{
               text-decoration:none;
        color:white ; 
    }
    div.row div.col-lg-4.col-sm-6.portfolio-item div.card.h-100 div.card-body h4.card-title a.link{
               text-decoration:none;
        color:white ; 
    }
    button.btn.btn-success a:hover{
 text-decoration:none;
        color:white ; 
    }
        a{

               text-decoration: none;
    display: inline-block;
    color: white;
    background-color: black;
    }
    a:link              { color:red; }
＆＃13; 
 <section id="portfolio">
   <!-- Page Content -->
    <div class="container" >

      <!-- Page Heading -->
      <h1 class="my-4 text-center"> Portfolio </h1>

      <div class="row">
        <div class="col-lg-4 col-sm-6 portfolio-item">
          <div class="card h-100">
            <a href="#"><img class="card-img-top"  src="img/vgroup.png" alt=""></a>
            <div class="card-body">
              <h4 class="card-title">
                <a href="http://mainvgroup.compy.global/">VGroup</a>
              </h4>
              <p class="card-text">Japan's largest independent aid organization </p>
            </div>
          </div>
        </div>
        <div class="col-lg-4 col-sm-6 portfolio-item">
          <div class="card h-100">
            <a href="#"><img class="card-img-top" src="img/vasdaq.png" alt=""></a>
            <div class="card-body">
              <h4 class="card-title">
                <a class="link" href="http://mainvasdaq.compy.global/">Vaqdaq</a>
              </h4>
              <p class="card-text">Japan's largest independent support organization</p>
            </div>
          </div>
        </div>
        <div class="col-lg-4 col-sm-6 portfolio-item">
          <div class="card h-100">
            <a href="#"><img class="card-img-top" src="img/nagateam.png" alt=""></a>
            <div class="card-body">
              <h4 class="card-title">
                <a href="https://nagataico.com/">Naga Team Asia ICO</a>
              </h4>
              <p class="card-text">Naga Team Asia, operating in the virtual content trading business, is a company established for the purpose of developing and expanding the Asian sales strategy of NAGA Group.</p>
            </div>
          </div>
        </div>
        <div class="col-lg-4 col-sm-6 portfolio-item">
          <div class="card h-100">
            <a href="#"><img class="card-img-top" src="img/itcross.png" alt=""></a>
            <div class="card-body">
              <h4 class="card-title">
                <a href="http://itcross.compy.global/">IT Cross Foundatoin</a>
              </h4>
              <p class="card-text">An abundance of Information Technology across the world is making life more convenient with the presence of IOT and robots.</p>
            </div>
          </div>
        </div>
        <div class="col-lg-4 col-sm-6 portfolio-item">
          <div class="card h-100">
            <a href="#"><img class="card-img-top" src="img/androbotics.png" alt=""></a>
            <div class="card-body">
              <h4 class="card-title">
                <a href="http://androboticsclark.compy.global/">Androbotics Clark Inc</a>
              </h4>
              <p class="card-text">Androbotics create, develop and design websites using wordpress, we also offer dynamic website services for our partners.</p>
            </div>
          </div>
        </div>
        <div class="col-lg-4 col-sm-6 portfolio-item">
          <div class="card h-100">
            <a href="#"><img class="card-img-top" src="img/votingsystem.png" alt=""></a>
            <div class="card-body">
              <h4 class="card-title">
                <a href="#">Voting System Using RSI Algorithm</a>
              </h4>
              <p class="card-text">E-voting is recording, storing and processing of electoral data of a voting system as digital information </p>
            </div>https://stackoverflow.com/questions/ask#
          </div>
        </div>
      </div>
      <!-- /.row -->
  </section>
＆＃13;
＆＃13;
＆＃13;

我尝试了很多可能的方法来添加我的CSS，即使在内联样式也没有用。是我的铬问题吗？在我的另一个项目中我如何设计我的HTML工作正常。但在这。我甚至没有把CSS添加到锚中。我知道这很简单，但它对我不起作用。即使在悬停。它不会更改默认事件。 enter image description here

2 个答案:

答案 0 :(得分：1)

打开开发人员工具，右键单击刷新，左键单击清除缓存并重新加载。

答案 1 :(得分：1)

看起来您遗漏了对Bootstrap CSS和JavaScript的引用。您可能还需要在浏览器中进行“硬”刷新（Chrome中的 Ctrl + Shift + R ）。试试这些，它应该按预期工作。

此外，不确定您是否只是在测试，但a:link伪选择器无效的原因是由于您在样式表中使用的!important规则。

a {
  text-decoration: none !important;
  color: white !important;
}

a:hover {
  text-decoration: none !important;
}

section #portfolio div.container div.row div.portfolio-item div.card div.card-body h4.card-title a {
  text-decoration: none;
  color: white;
}

section #portfolio div.container div.row div.card-body h4.card-title a:hover {
  text-decoration: none;
  color: white;
}

h4.card-title a:hover {
  text-decoration: none;
  color: white;
}

a:hover {
  text-decoration: none;
  color: white;
}

section#portfolio div.container div.row div.col-lg-4.col-sm-6.portfolio-item div.card.h-100 div.card-body h4.card-title a.link {
  text-decoration: none;
  color: white;
}

h4.card-title a {
  text-decoration: none;
  color: white;
}

div.row div.col-lg-4.col-sm-6.portfolio-item div.card.h-100 div.card-body h4.card-title a.link {
  text-decoration: none;
  color: white;
}

button.btn.btn-success a:hover {
  text-decoration: none;
  color: white;
}

a {
  text-decoration: none;
  display: inline-block;
  color: white;
  background-color: black;
}

a:link {
  color: red !important;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.bundle.min.js"></script>
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" />


<section id="portfolio">
  <!-- Page Content -->
  <div class="container">

    <!-- Page Heading -->
    <h1 class="my-4 text-center"> Portfolio </h1>

    <div class="row">
      <div class="col-lg-4 col-sm-6 portfolio-item">
        <div class="card h-100">
          <a href="#"><img class="card-img-top" src="http://via.placeholder.com/350x150" alt=""></a>
          <div class="card-body">
            <h4 class="card-title">
              <a href="http://mainvgroup.compy.global/">VGroup</a>
            </h4>
            <p class="card-text">Japan's largest independent aid organization </p>
          </div>
        </div>
      </div>
      <div class="col-lg-4 col-sm-6 portfolio-item">
        <div class="card h-100">
          <a href="#"><img class="card-img-top" src="http://via.placeholder.com/350x150" alt=""></a>
          <div class="card-body">
            <h4 class="card-title">
              <a class="link" href="http://mainvasdaq.compy.global/">Vaqdaq</a>
            </h4>
            <p class="card-text">Japan's largest independent support organization</p>
          </div>
        </div>
      </div>
      <div class="col-lg-4 col-sm-6 portfolio-item">
        <div class="card h-100">
          <a href="#"><img class="card-img-top" src="http://via.placeholder.com/350x150" alt=""></a>
          <div class="card-body">
            <h4 class="card-title">
              <a href="https://nagataico.com/">Naga Team Asia ICO</a>
            </h4>
            <p class="card-text">Naga Team Asia, operating in the virtual content trading business, is a company established for the purpose of developing and expanding the Asian sales strategy of NAGA Group.</p>
          </div>
        </div>
      </div>
      <div class="col-lg-4 col-sm-6 portfolio-item">
        <div class="card h-100">
          <a href="#"><img class="card-img-top" src="http://via.placeholder.com/350x150" alt=""></a>
          <div class="card-body">
            <h4 class="card-title">
              <a href="http://itcross.compy.global/">IT Cross Foundatoin</a>
            </h4>
            <p class="card-text">An abundance of Information Technology across the world is making life more convenient with the presence of IOT and robots.</p>
          </div>
        </div>
      </div>
      <div class="col-lg-4 col-sm-6 portfolio-item">
        <div class="card h-100">
          <a href="#"><img class="card-img-top" src="http://via.placeholder.com/350x150" alt=""></a>
          <div class="card-body">
            <h4 class="card-title">
              <a href="http://androboticsclark.compy.global/">Androbotics Clark Inc</a>
            </h4>
            <p class="card-text">Androbotics create, develop and design websites using wordpress, we also offer dynamic website services for our partners.</p>
          </div>
        </div>
      </div>
      <div class="col-lg-4 col-sm-6 portfolio-item">
        <div class="card h-100">
          <a href="#"><img class="card-img-top" src="http://via.placeholder.com/350x150" alt=""></a>
          <div class="card-body">
            <h4 class="card-title">
              <a href="#">Voting System Using RSI Algorithm</a>
            </h4>
            <p class="card-text">E-voting is recording, storing and processing of electoral data of a voting system as digital information </p>
          </div>
        </div>
      </div>
    </div>
    <!-- /.row -->
  </div>
</section>

相关问题
最新问题