发表新帖
发表新帖

How can I replace text with CSS?

前端 未结
关注
21 2134
暗喜
暗喜 2020-11-22 06:17

How can I replace text with CSS using a method like this:

.pvw-title img[src*=\"IKON.img\"] { visibility:hidden; }

Instead of ( img

相关标签:
21条回答
  • 鱼传尺愫
    2020-11-22 07:16

    This isn't really possible without tricks. Here is a way that works by replacing the text with an image of text.

    .pvw-title{
    text-indent: -9999px;
    background-image: url(text_image.png)
}

    This type of thing is typically done with JavaScript. Here is how it can be done with jQuery:

    $('.pvw-title').text('new text');
    0 讨论(0)
  • 星月不相逢
    2020-11-22 07:19

    You can't, well, you can. 

    .pvw-title:after {
  content: "Test";
}

    This will insert content after the current content of the element. It doesn't actually replace it, but you can choose for an empty div, and use CSS to add all the content.

    But while you more or less can, you shouldn't. Actual content should be put in the document. The content property is mainly intended for small markup, like quotation marks around text that should appear quoted.

    0 讨论(0)
  • 感情败类
    2020-11-22 07:19

    Try using :before and :after. One inserts text after HTML is rendered, and the other inserts before HTML is rendered. If you want to replace text, leave button content empty.

    This example sets the button text according to the size of the screen width.

    <meta name="viewport" content="width=device-width, initial-scale=1">

<style>
  button:before {
    content: 'small screen';
  }
  @media screen and (min-width: 480px) {
    button:before {
      content: 'big screen';
    }
  }
</style>
<body>
  <button type="button">xxx</button>
  <button type="button"></button>
</body>

    Button text:

    1. With :before

      big screenxxx

      big screen

    2. With :after

      xxxbig screen

      big screen

    0 讨论(0)
 看不清?
提交回复
热议问题