logo标签列表

用CSS制作带纹理的文字？

css
7
我正在开发一个简单的页面。 有人知道如何在文本上叠加纹理图像吗？看起来现在的规范似乎不允许，但如果可能的话，请告诉我。 谢谢，保重！
3个回答
5
因为目前仅限于预设的 Webkit 解决方案。 - snarf
1
不，它不是。适用于所有现代浏览器。 - adriendenat
你编辑了你的回答...然后回复好像我在评论编辑过的版本。你原来的是webkit前缀。无论如何，不管你喜欢与否，12%的市场份额仍然使IE成为主流浏览器。移动支持看起来也不太稳定（你知道，截至撰写本文时）。总之，我认为它还没有完全到位。 - snarf
1
我进行了编辑，因为我认为读者们可以自己添加未加前缀的版本。您也可以让用户根据其目标用户选择解决此问题的任何解决方案。与其努力使我的答案看起来像是一个糟糕的答案（为什么呢？..），不如让他们知道是否要支持IE（另外，听说过“渐进增强”吗？）。 - adriendenat
只要人们知道在IE上是不行的，在移动设备上也有问题，我就很高兴了。没有个人恩怨。只是分享一些有用的信息。 :) 实际上，我建议将其添加到答案中，但这取决于你。 - snarf
答案很好。是时候不再关心IE了。这样，一旦最后仍在使用IE的少数人（约3％）要么死亡，要么意识到“互联网”对他们已经不起作用了，那么他们就会升级。 - ashleedawg
3

使用本地CSS 2.1无法在文本上覆盖图像，这也不会被实现到CSS 3.0中。最佳实践是使用背景图像，并仍然在<h1>标签中使用文本，并使用CSS将其隐藏。

<style>
h1 { background:url(images/imagepath.png) no-repeat; height:50px; width:300px; text-indent:-10000px; }
</style>

<body>
   <h1>Insert Text Here</h1>
</body>
这也是我所想的。感谢您花时间打出HTML代码。 - John Calvin
1

仅使用纯CSS无法实现，而且肯定无法以跨浏览器兼容的方式实现。最好将其制作为透明的.png图像。

谢谢 - 我们可以希望有一个浏览器能够友好地协作的日子！在那之前，请保重。 - John Calvin
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接