我如何用CSS替换文本使用这样的方法:
.pvw-title img[src*="IKON.img"] { visibility:hidden; }
而不是(img[src*="IKON. "img"])，我需要使用一些可以代替文本的东西。
我必须使用[]才能让它工作。
< div级= >事实“pvw-title < / div >
我得把"事实"替换掉。
当前回答
如果您只是想显示不同的文本或图像，请保持标记为空，并将内容写入多个数据属性，如<span data-text1="Hello" data-text2="Bye"></span>。 使用一个伪类显示它们:before {content: attr(data-text1)}
现在你有很多不同的方法在它们之间切换。我将它们与媒体查询结合使用，以实现响应式设计方法，将导航的名称更改为图标。
Jsfiddle演示和示例
它可能不能完美地回答这个问题，但它满足了我的需求，也许也满足了其他人的需求。
其他回答
例子
<!DOCTYPE html>
<html>
<head>
<title>Devnote</title>
<style>
.replacedValue {
visibility: hidden;
position: relative;
}
.replacedValue:after {
visibility: visible;
position: absolute;
top: 0;
left: 0;
content: "Devnote is developer answer solve. devnote.in";
}
</style>
</head>
<body>
<p class="replacedValue">Old Text Here</p>
</body>
</html>
输出
Devnote is developer answer solve. devnote.in
与我在其他每个答案中看到的不同，您不需要使用伪元素来将标记的内容替换为图像
<div class="pvw-title">Facts</div>
div.pvw-title { /* No :after or :before required */
content: url("your URL here");
}
如果您只是想显示不同的文本或图像，请保持标记为空，并将内容写入多个数据属性，如<span data-text1="Hello" data-text2="Bye"></span>。 使用一个伪类显示它们:before {content: attr(data-text1)}
现在你有很多不同的方法在它们之间切换。我将它们与媒体查询结合使用，以实现响应式设计方法，将导航的名称更改为图标。
Jsfiddle演示和示例
它可能不能完美地回答这个问题，但它满足了我的需求，也许也满足了其他人的需求。
如果没有技巧，这是不可能的。这里有一种通过用文本的图像替换文本的方法。
.pvw-title{
text-indent: -9999px;
background-image: url(text_image.png)
}
这类事情通常是用JavaScript完成的。下面是如何用jQuery完成的:
$('.pvw-title').text('new text');
我用了这个技巧:
.pvw-title {
text-indent: -999px;
}
.pvw-title:after {
text-indent: 0px;
float: left;
content: 'My New Content';
}
我甚至用它来处理页面的国际化，只需要改变一个基类…
.translate-es .welcome {
text-indent: -999px;
}
.translate-es .welcome:after {
text-indent: 0px;
float: left;
content: '¡Bienvenidos!';
}
