首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >剪切CSS中的文本。有可能吗?

剪切CSS中的文本。有可能吗?
EN

Stack Overflow用户
提问于 2012-02-01 00:14:24
回答 1查看 5.5K关注 0票数 17

比如说,我们有:

代码语言:javascript
复制
<div class="outer">
    <div class="inner">
        <span class="text">Hello!</span>
    </div>
</div>

'outer‘div有一个线性的渐变背景。“内部”div的背景是蓝色的。有没有可能使文本的颜色与'outer‘div的颜色相同。一种文本蒙版效果:

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2012-02-01 01:09:22

你可以使用KP提到的文本透明性来伪造它。首先,对span应用与在外部div上相同的渐变。然后,将蓝色背景应用到内部div,文本看起来就像被剔除掉了一样。我有一台sample fiddle hereHere's an article详细介绍了这项技术。

请记住,第一种技术在IE中不起作用。如果你也想在IE中达到类似的效果,你可以使用technique shown here。这项技术需要一个png和一些额外的标记,但它似乎在任何地方都有效。由于这不是一个真正的文本掩码,您可能需要尝试一下才能使其恰到好处。

更新:进一步的测试表明Firefox没有显示第一种技术...我会坚持使用第二个,但它不再仅仅是CSS,它确实需要一个图像。

票数 5
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/9082909

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档