css 如何 用给定的类从跨度的末尾删除?

idv4meu8  于 2023-03-20  发布在  其他
关注(0)|答案(6)|浏览(167)

我需要删除给定跨距值后的 
HTML看起来像这样:

<span class="number">0.15&nbsp;</span>

来自 服务器(CMS)。
有没有办法 通过使用CSS规则来删除?

oxf4rvwz

oxf4rvwz1#

如果这个值是由CMS提供的,那么你可以在span中回显之前通过str_replace('&nbsp;', '', $yourVar)用php修改这个值。
如果你不能用这个访问,你也可以用jQuery来做这件事...就像Muhammad Ali说的:

var str = $('.number').html();
str = str.replace('&nbsp;', '');
$('.number').html(str);

像这样的东西可以工作。但与CSS,是不可能的,我猜。

bbmckpt7

bbmckpt72#

你不能只用css来做这个,你必须用jquery来做这个,用正则表达式你可以简单地做这个。

var span = $('span').html();
span = span.replace(/&nbsp;/g, '');
$('span').html(span);

DEMO

注:&nbsp;来自CMS,当您的文档完全加载时,您必须使用jquery代码来替换它。

$(document).ready(function(){
    var span = $('span').html();
    span = span.replace(/&nbsp;/g, '');
    $('span').html(span);
});
zc0qhyus

zc0qhyus3#

你不可能用CSS从文档内容中删除字符。这不是CSS的用途。你可以在生成的内容中 * 添加 * 要呈现的字符,但不能删除。
但是,您可以在渲染时撤消字符的 * 效果 *。请考虑以下示例:

<span class="number">0.15&nbsp;</span>foo

无中断空格(&nbsp;)有两个作用:它会产生可见间距,与普通空格字符相同,并且在浏览器设置文本格式时,它会防止“0.15”和“foo”之间出现换行符。要防止后一种效果,您可以使用生成的内容添加普通空格,但如果不显示换行符,则会产生太大的间距。要解决此问题,请将伪元素的宽度设置为零:

.number:after { content: " "; display: inline-block; width: 0; }

若要消除不间断空格的间距效果,可以设置负右边距。这样做的主要问题是不间断空格的宽度(和一个空格)取决于字体。它平均约为em的四分之一,但也可能变化很大。如果您可以将字体视为固定(例如,您使用的是@font-face),则可以使用以下代码,只根据需要调整数值:

.number {  display: inline-block; margin-right: -0.25em; }

作为一个副作用,这也可能允许在“0. 15”和“foo”之间换行,因为浏览器可能会在格式中处理内联块,以便它们总是允许在前后换行。

46qrfjad

46qrfjad4#

你可以使用javascript/Jquery框架来删除任何字符键,例如Here

var span = $('span').html();
span = span.replace('&nbsp;','');
$('span').html(span);
kiayqfof

kiayqfof5#

虽然您不能使用CSS完全删除&nbsp;,但下面的CSS规则可以强制执行正常空间的行为。

overflow-wrap: break-word;
word-break: break-word;
lx0bsm1f

lx0bsm1f6#

你需要用JS或者PHP来做,这取决于你用的是什么。断字或断字:断字也会断开字母,而且语法不正确。

相关问题