悬停无颜色

时间:2018-07-12 07:58:05

标签: javascript jquery html css

当鼠标悬停时,我似乎无法弄清为什么其余3个选项卡没有颜色。前3个工作正常,而其余3个工作不正常。我只对它们的边距进行了调整,仅此而已。我只想将代码放在Blogger博客上,因为它很有帮助。以下是我遇到问题的代码。他们正在控制台上工作,但是当我将其放在博客上时,悬停效果并不存在。

p {
  margin-top: -30px;
}

.ctc-txt.bg_ffffff.br6 {
  width: 642px;
  height: 200px;
}

.clr-txt {
  top: 160px;
}

.text-center.ct-case.mb10 {
  display: flex;
  align-items: right;
  justify-content: center;
  margin-top: -20px;
  margin-left: 120px;
}

.counter {
  margin-left: -14px;
}

#copyStr {
  margin-left: 260px;
  margin-top: -10px;
}

#text {
  top: -30px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://rawgit.com/Dieffer/test1/master/mycss.css">
<form method="post" id="text" action="">
  <p class="">
    Type or Paste your text here to change text case
  </p>
  <div class="relative">
    <textarea class="ctc-txt bg_ffffff br6" name="form_content" id="form_content" onclick="cont()"> </textarea>
    <img class="clr-txt" onclick="resete()" src="https://smallseotools.com/asets/images/cleartext.svg">
  </div>
  <div class="col-lg-12 col-sm-12 pn pt5 pb5">
    <div class="button_box h-a">
      <div class="counter">
        <label>Character Count: <span id="cc"> 0 </span></label>
        <label>- Word Count: <span id="wc"> 0 </span></label>
      </div>
    </div>
  </div>
  <div class="text-center ct-case mb10" id="ctc_button_box">
    <input name="toggle" class="button ctc-btn br6" type="button" id="toggle" value="tOGGLE cASE">
    <input name="sentence" class="button ctc-btn br6" type="button" id="sentence" value="Sentence case">
    <input name="lower" class="button ctc-btn br6" type="button" id="lower" value="lower case">
    <input name="" class="button ctc-btn br6" type="button" id="upper" value="UPPER CASE">
    <input name="capitalized" class="button ctc-btn br6" type="button" id="capitalized" value="Capitalize Word">
    <input name="alternating" class="button ctc-btn br6" type="button" id="alternating" value="aLtErNaTe cAsE">
  </div>
</form>

1 个答案:

答案 0 :(得分:1)

您是否尝试清理浏览器缓存? 由于该代码正常运行,因此可能会导致问题。