mirror of
https://github.com/RGBCube/serenity
synced 2025-07-26 12:57:34 +00:00
9165faca5e
From https://drafts.csswg.org/css-backgrounds-4/#background-clip "The background is painted within (clipped to) the intersection of the border box and the geometry of the text in the element and its in-flow and floated descendants" This change implements it in the following way: 1. Traverse the descendants of the element, collecting the Gfx::Path of glyphs into a vector. 2. The vector of collected paths is saved in the background painting command. 3. The painting commands executor uses the list of glyphs to paint a mask for background clipping. Co-authored-by: Aliaksandr Kalenik <kalenik.aliaksandr@gmail.com>
15 lines
331 B
HTML
15 lines
331 B
HTML
<style>
|
|
* {
|
|
margin: 0;
|
|
}
|
|
body {
|
|
background-color: white;
|
|
}
|
|
</style>
|
|
<!-- To rebase:
|
|
1. Open background-clip-text.html in Ladybird
|
|
2. Resize the window just above the width of the canvas
|
|
3. Right click > "Take Full Screenshot"
|
|
4. Update the image below:
|
|
-->
|
|
<img src="./images/css-background-clip-text.png">
|