我有一個& lta & gt元素，里面有一個h6和普通文本。如何設置普通文本部分的樣式？ 我嘗試使用:not(h6)來放置填充和邊框半徑:20px和其他樣式...查看我的css:

.uagb-taxomony-box  {
  background-color:transparent!important;
  border:none!important;
  text-decoration:none!important;
  text-align:left!important;
  
}

a.uagb-tax-link h6{text-align:left!important;}

.uagb-tax-link:not(h6){
  text-decoration:none!important;
  padding:5px!important;
  background-color:#18419C!important;
  border-radius:20px!important;
}

<div class="uagb-taxomony-box">
        <a class="uagb-tax-link" >
          <h6 class="uagb-tax-title">Desenvolupament de negoci</h6>
        " 16 Projectes "
        </a>
    </div>

您可以顯示:inline-block to & quot；a & quot元素。如果你想只給文本背景。然后將文本放入span元素中，并對其進行樣式化。以下是更新后的代碼:-

.uagb-taxomony-box  {
  background-color:transparent!important;
  border:none!important;
  text-decoration:none!important;
  text-align:left!important;
  
}

a.uagb-tax-link:not(h6){
  display: inline-block;
    text-decoration:none!important;
    padding:5px!important;
    border-radius:20px!important;
}

a.uagb-tax-link h6{
    text-align:left!important;
}



.simple-text{
  background-color:#18419C!important;
  color: #fff;
}

<div class="uagb-taxomony-box">
        <a class="uagb-tax-link" >
          <h6 class="uagb-tax-title">Desenvolupament de negoci</h6>
          <span class="simple-text"> " 16 Projectes " </span>
        </a>
    </div>

您可以使用position: absolute:

.uagb-taxomony-box  {
  background-color:transparent!important;
  border:none!important;
  text-decoration:none!important;
  text-align:left!important;
  
}

a.uagb-tax-link h6{text-align:left!important;}

.uagb-tax-link {
  display: inline-block;
  margin-top: 80px;
  position: relative;
  text-decoration:none!important;
  padding:5px!important;
  background-color:#18419C!important;
  border-radius:20px!important;
  color: #fff;
}
.uagb-tax-link h6 {
  position: absolute;
  top: -80px;
  color: #000;
}

<div class="uagb-taxomony-box">
        <a class="uagb-tax-link" >
          <h6 class="uagb-tax-title">Desenvolupament de negoci</h6>
        " 16 Projectes "
        </a>
    </div>

正如https://stackoverflow.com/users/16948533/developer所指出的，我需要在這里添加一個跨度來恰當地設計h6號部件。

然后我用了類似這樣的東西:

$('.uagb-tax-link').each(function() {
    var $link = $(this);
    var $textNodes = $link.contents().filter(function() {
      return this.nodeType === 3;
    });
    var $span = $('<span class="text-no-h6"></span>').text($textNodes.last().text());
    $textNodes.last().replaceWith($span);
  });

然后css get的格式為:

.uagb-taxomony-box  {
  background-color:transparent!important;
  border:none!important;
  text-decoration:none!important;
  text-align:left!important;
  
}

a.uagb-tax-link h6{text-align:left!important;}

span.text-no-h6{
  text-decoration:none!important;
  padding:5px!important;
  background-color:#18419C!important;
  border-radius:20px!important;
}