This works on tiddlywiki.com

<style>
.jack {
  font-size: 72px;
  background: url(<$macrocall $name="datauri" title="Motovun Jack.jpg" 
$output="text/plain"/>);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
</style>

<div class="jack">

!GOLD
</div>

<:-)


On Monday, November 8, 2021 at 8:52:06 PM UTC+1 taale...@gmail.com wrote:

> I'm trying to make a class that will allow me to fill text with an image. 
> For example, making a drop cap for a manuscript-inspired theme that looks 
> like it's been gilded, by using an image of gold leaf.
>
> The interwebz tell me that I want to use background-clip, but I'm not sure 
> how to set that up in a CSS class. Does anyone have any pointers?
>
> All I have so far, which doesn't work (and I didn't think it would):
>
> .dropcap { font-size: 40px;
> margin: 10pc;
> border: 5px double black;
> float: left; background-image: url(<$macrocall $name="datauri" 
> title="paua.jpg" $output="text/plain"/>) background-clip: text; }
>
> Thanks,
> Aidan
>

-- 
You received this message because you are subscribed to the Google Groups 
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to tiddlywiki+unsubscr...@googlegroups.com.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/tiddlywiki/a176c54b-b9b3-4bfe-ac7f-b0891028dc6cn%40googlegroups.com.

Reply via email to