我如何用CSS替换文本使用这样的方法:
.pvw-title img[src*="IKON.img"] { visibility:hidden; }
而不是(img[src*="IKON. "img"]),我需要使用一些可以代替文本的东西。
我必须使用[]才能让它工作。
< div级= >事实“pvw-title < / div >
我得把"事实"替换掉。
我如何用CSS替换文本使用这样的方法:
.pvw-title img[src*="IKON.img"] { visibility:hidden; }
而不是(img[src*="IKON. "img"]),我需要使用一些可以代替文本的东西。
我必须使用[]才能让它工作。
< div级= >事实“pvw-title < / div >
我得把"事实"替换掉。
当前回答
例子
<!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
其他回答
你不能,嗯,你可以。
.pvw-title:after {
content: "Test";
}
这将在元素的当前内容之后插入内容。它实际上并不替换它,但您可以选择一个空的div,并使用CSS添加所有的内容。
虽然你或多或少可以,但你不应该这样做。实际内容应写入文件。content属性主要用于小型标记,比如文本周围的引号应该被引用。
我比较幸运地将外部元素的font-size: 0和:after选择器的font-size设置为我需要的任何东西。
我找到了一个这样的解决方案,在较小的屏幕宽度上,一个单词“Dark”将被缩短为“D”。基本上,您只需使原始内容的字体大小为0,并将缩短的形式作为伪元素。
在这个例子中,改变发生在hover上:
跨度{ 字体大小:12 px; } 跨度:{后 显示:没有; 字体大小:12 px; 内容:' D '; 颜色:红色; } 跨度:{徘徊 字体大小:0 px; } 跨度:徘徊:{后 显示:内联; } 黑暗< span > < / span >
这适用于我的内联文本。它在Firefox、Safari、Chrome和Opera上进行了测试。
<p>Lorem ipsum dolor sit amet, consectetur <span>Some Text</span> adipiscing elit.</p>
span {
visibility: hidden;
word-spacing: -999px;
letter-spacing: -999px;
}
span:after {
content: "goodbye";
visibility: visible;
word-spacing: normal;
letter-spacing: normal;
}
我发现的最简单的方法是使元素font-size: 0px,然后在创建:后pseudo时用任何字体大小覆盖它。在下面的例子:
.pvw-title {
font-size:0px;
}
.pvw-title:after {
content: "Hello";
font-size:15px !important;
}