Question

我遇到了css试图在＆lt;之后删除文本的问题。跨度＆GT;标记以附加其他文本。我怎么能删除这个

<p class="entry-meta">
   <span class="entry-author" itemprop="author" itemscope="">
      <a href="#"class="entry-author-link" itemprop="url" rel="author">
         <span class="entry-author-name" itemprop="name">yesi</span>
      </a> 
   </span> /  (this slash needs to be removed with css)</p>

Answer 1

<p class="replaced"><span>Original Text</span></p>

使用CSS显示属性，您可以隐藏标记内的内容，然后将包含新内容的伪元素附加到

标记。你不需要在这里使用绝对定位，因为display：none;从页面中完全删除元素，它确实会影响布局。就好像元素中的文本永远不存在一样。

这是CSS：

.replaced span {
    display: none;
}

.replaced:after {
    content: "This text replaces the original.";
}

For More INfo click here

HTML：

 <p class="entry-meta replaced"><span class="entry-author" itemprop="author" 
       itemscope=""><a href="#"class="entry-author-link" itemprop="url" rel="author"> <span class="entry-author-name" itemprop="name">yesi</span></a> 
            </span><span class="ll">/  (this slash needs to be removed with css)</span></p>

<强> CSS

.ll {
    display: none;
}

.replaced:after {
    content: "This text replaces the original.";
}

jsfiddle

Answer 2

只需使用此css行： .entry-meta {font-size：0; } .entry-meta .entry-author {font-size：12px！important; }

Answer 3

CSS无法删除文本，必须通过JavaScript手动或以编程方式删除文本。 CSS是演示文稿，因此它可以隐藏文本。在我的脑海中有4种方法可以解决它，它们都涉及隐藏p.entry-meta的内容并揭示span.entry-author的内容。以下演示有4个示例。

演示

/* Example A - alpha/opacity */
.entry-metaA {color:rgba(0,0,0,0)}
.entry-authorA {color:rgba(0,0,0,1)}
/**/

/* Example B - transparency */
.entry-metaB {color:transparent}
.entry-authorB {color:black}
/**/

/* Example C - font-size */
.entry-metaC {font-size:0}
.entry-authorC {font-size:16px}
/* Props to D.M. */

/* Example D - visible children elements */
.entry-metaD {visibility: hidden}
.entry-authorD {visibility: visible}
/**/

<p class="entry-metaA">
   <span class="entry-authorA" itemprop="author" itemscope="">
      <a href="#"class="entry-author-link" itemprop="url" rel="author">
         <span class="entry-author-name" itemprop="name">yesi</span>
      </a> 
   </span> /  (this slash needs to be removed with css)
</p>
   
   
<p class="entry-metaB">
   <span class="entry-authorB" itemprop="author" itemscope="">
      <a href="#"class="entry-author-link" itemprop="url" rel="author">
         <span class="entry-author-name" itemprop="name">yesi</span>
      </a> 
   </span> /  (this slash needs to be removed with css)
</p>

<p class="entry-metaC">
   <span class="entry-authorC" itemprop="author" itemscope="">
      <a href="#"class="entry-author-link" itemprop="url" rel="author">
         <span class="entry-author-name" itemprop="name">yesi</span>
      </a> 
   </span> /  (this slash needs to be removed with css)
</p>

<p class="entry-metaD">
   <span class="entry-authorD" itemprop="author" itemscope="">
      <a href="#"class="entry-author-link" itemprop="url" rel="author">
         <span class="entry-author-name" itemprop="name">yesi</span>
      </a> 
   </span> /  (this slash needs to be removed with css)
</p>

Answer 4

你的意思是你想隐藏那个文字？

然后你可以上课.hideme {display: none;}

如果你想删除你需要用java脚本执行它的文本，有很多方法可以做到这一点。

您可以使用结尾p代码发布整个代码吗？

使用css删除<span>后的斜杠

4 个答案:

演示