40 lines
1.4 KiB
HTML
40 lines
1.4 KiB
HTML
|
<html><body><svg width="1000" height="600" xmlns="http://www.w3.org/2000/svg">
|
||
|
|
<!-- The pattern needs to scale with the text in the same way it scales with rectangles. -->
|
||
|
|
<defs>
|
||
|
|
<pattern id="hatch" patternUnits="userSpaceOnUse" x="0" y="0" width="10" height="10">
|
||
|
|
<g style="fill:none; stroke:black; stroke-width:1">
|
||
|
|
<path d="M0,0 l10,10"/>
|
||
|
|
<path d="M10,0 l-10,10"/>
|
||
|
|
</g>
|
||
|
|
</pattern>
|
||
|
|
<style type="text/css"><![CDATA[
|
||
|
|
@font-face {
|
||
|
|
font-family: Ahem;
|
||
|
|
src: url(../../resources/Ahem.ttf);
|
||
|
|
}
|
||
|
|
.ahemblock {
|
||
|
|
font-family: Ahem;
|
||
|
|
font-size: 30px;
|
||
|
|
}
|
||
|
|
]]>
|
||
|
|
</style>
|
||
|
|
<!-- Masking away the micro-gaps between the Ahem characters that may occur due to rounding
|
||
|
|
which causes this test to fail on platforms that run reftests with zero tolerance. -->
|
||
|
|
<clipPath id="clipHack">
|
||
|
|
<rect x="3" y="0" width="24" height="600"></rect>
|
||
|
|
<rect x="33" y="10" width="24" height="600"></rect>
|
||
|
|
<rect x="63" y="0" width="24" height="600"></rect>
|
||
|
|
<rect x="93" y="0" width="24" height="600"></rect>
|
||
|
|
<rect x="123" y="0" width="24" height="600"></rect>
|
||
|
|
</clipPath>
|
||
|
|
</defs>
|
||
|
|
<g transform="scale(4)" clip-path="url(#clipHack)">
|
||
|
|
<text class="ahemblock" y="50" fill="url(#hatch)">AAAAA</text>
|
||
|
|
</g>
|
||
|
|
<g transform="scale(6)" clip-path="url(#clipHack)">
|
||
|
|
<text class="ahemblock" y="90" x="0" fill="url(#hatch)">AAAAA</text>
|
||
|
|
</g>
|
||
|
|
</svg>
|
||
|
|
</body>
|
||
|
|
</html>
|