168 lines
7.0 KiB
XML
168 lines
7.0 KiB
XML
<?xml version="1.0" standalone="no"?>
|
|
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20000802//EN"
|
|
"http://www.w3.org/TR/2000/CR-SVG-20000802/DTD/svg-20000802.dtd">
|
|
|
|
<!-- ========================================================================= -->
|
|
<!-- Copyright (C) The Apache Software Foundation. All rights reserved. -->
|
|
<!-- -->
|
|
<!-- This software is published under the terms of the Apache Software License -->
|
|
<!-- version 1.1, a copy of which has been included with this distribution in -->
|
|
<!-- the LICENSE file. -->
|
|
<!-- ========================================================================= -->
|
|
|
|
<!-- ========================================================================= -->
|
|
<!-- Test 'display' property -->
|
|
<!-- -->
|
|
<!-- @author tkormann@apache.org -->
|
|
<!-- @version $Id: display.svg,v 1.1.1.1 2001-06-10 01:46:38 edburns%acm.org Exp $ -->
|
|
<!-- ========================================================================= -->
|
|
|
|
<?xml-stylesheet type="text/css" href="test.css" ?>
|
|
|
|
|
|
<svg id="body" width="450" height="500" viewBox="0 0 450 500">
|
|
<title> Test 'display' property</title>
|
|
<!-- ============================================================= -->
|
|
<!-- Test content -->
|
|
<!-- ============================================================= -->
|
|
<g id="testContent">
|
|
|
|
<text x="225" y="40" class="title">
|
|
Test 'display' property
|
|
</text>
|
|
|
|
<g id="array">
|
|
<g style="stroke:black;fill:none;">
|
|
<rect x="45" y="60" width="360" height="20" fill="#eee"/>
|
|
<rect x="25" y="80" width="20" height="360" fill="#eee"/>
|
|
<rect x="45" y="80" width="360" height="360" />
|
|
|
|
<line x1="165" y1="60" x2="165" y2="440" />
|
|
<line x1="285" y1="60" x2="285" y2="440" />
|
|
|
|
<line x1="25" y1="170" x2="405" y2="170" />
|
|
<line x1="25" y1="260" x2="405" y2="260" />
|
|
<line x1="25" y1="350" x2="405" y2="350" />
|
|
</g>
|
|
<g style="text-anchor:middle; font-size:10pt; fill:black; stroke:none">
|
|
<text x="105" y="75">display:inherit</text>
|
|
<text x="225" y="75">display:inline</text>
|
|
<text x="345" y="75">display:none</text>
|
|
|
|
|
|
<text x="0" y="0" transform="translate(40, 125) rotate(-90)"><rect></text>
|
|
|
|
<text x="0" y="0" transform="translate(40, 215) rotate(-90)"><g></text>
|
|
|
|
<text x="0" y="0" transform="translate(40, 305) rotate(-90)"><clipPath></text>
|
|
|
|
<text x="0" y="0" transform="translate(40, 395) rotate(-90)"><mask></text>
|
|
</g>
|
|
</g>
|
|
|
|
<!-- #################################################### -->
|
|
<!-- #################################################### -->
|
|
|
|
<!-- a rectangle with its display property set to 'inherit' -->
|
|
<rect x="65" y="90" width="80" height="70" style="fill:crimson; display:inherit" />
|
|
|
|
<!-- a rectangle with its display property set to 'inline' -->
|
|
<rect x="185" y="90" width="80" height="70" style="fill:crimson; display:inline" />
|
|
|
|
<!-- a rectangle with its display property set to 'none -->
|
|
<rect x="305" y="90" width="80" height="70" style="fill:crimson; display:none" />
|
|
|
|
|
|
<!-- #################################################### -->
|
|
<!-- #################################################### -->
|
|
|
|
<!-- a group with its display property set to 'inherit' -->
|
|
<g style="display:inherit">
|
|
<ellipse cx="95" cy="215" rx="30" ry="40" style="fill:crimson;" />
|
|
<ellipse cx="115" cy="215" rx="30" ry="40" style="fill:gold;" />
|
|
</g>
|
|
|
|
<!-- a group with its display property set to 'inline' -->
|
|
<g style="display:inline">
|
|
<ellipse cx="215" cy="215" rx="30" ry="40" style="fill:crimson;" />
|
|
<ellipse cx="235" cy="215" rx="30" ry="40" style="fill:gold;" />
|
|
</g>
|
|
|
|
<!-- a group with its display property set to 'none' -->
|
|
<g style="display:none">
|
|
<ellipse cx="335" cy="215" rx="30" ry="40" style="fill:crimson;" />
|
|
<ellipse cx="355" cy="215" rx="30" ry="40" style="fill:gold;" />
|
|
</g>
|
|
|
|
|
|
<!-- #################################################### -->
|
|
<!-- #################################################### -->
|
|
<defs>
|
|
<!-- a clipPath with its children display properties set to 'inherit' -->
|
|
<clipPath id="clipInherit" clipPathUnits="objectBoundingBox">
|
|
<ellipse cx=".3" cy=".5" rx=".3" ry=".5" style="display:inherit"/>
|
|
<ellipse cx=".7" cy=".5" rx=".3" ry=".5" style="display:inherit"/>
|
|
</clipPath>
|
|
|
|
<!-- a clipPath with its children display properties set to 'inline' -->
|
|
<clipPath id="clipInline" clipPathUnits="objectBoundingBox">
|
|
<ellipse cx=".3" cy=".5" rx=".3" ry=".5" style="display:inline"/>
|
|
<ellipse cx=".7" cy=".5" rx=".3" ry=".5" style="display:inline"/>
|
|
</clipPath>
|
|
|
|
<!-- a clipPath with its children display properties set to 'none' -->
|
|
<clipPath id="clipNone" clipPathUnits="objectBoundingBox">
|
|
<ellipse cx=".3" cy=".5" rx=".3" ry=".5" style="display:none"/>
|
|
<ellipse cx=".7" cy=".5" rx=".3" ry=".5" style="display:none"/>
|
|
</clipPath>
|
|
</defs>
|
|
|
|
<rect x="65" y="270" width="80" height="70" style="fill:crimson; clip-path:url(#clipInherit);" />
|
|
|
|
<rect x="185" y="270" width="80" height="70" style="fill:crimson; clip-path:url(#clipInline);" />
|
|
|
|
<rect x="305" y="270" width="80" height="70" style="fill:crimson; clip-path:url(#clipNone);" />
|
|
|
|
<!-- #################################################### -->
|
|
<!-- #################################################### -->
|
|
<defs>
|
|
<mask id="maskInherit" maskContentUnits="objectBoundingBox"
|
|
x="0" y="0" width="100%" height="100%" style="fill:white">
|
|
<circle cx=".2" cy=".2" r=".2" style="display:inherit"/>
|
|
<circle cx=".8" cy=".2" r=".2" style="display:inherit"/>
|
|
<circle cx=".2" cy=".8" r=".2" style="display:inherit"/>
|
|
<circle cx=".8" cy=".8" r=".2" style="display:inherit"/>
|
|
</mask>
|
|
|
|
<mask id="maskInline" maskContentUnits="objectBoundingBox"
|
|
x="0" y="0" width="100%" height="100%" style="fill:white">
|
|
<circle cx=".2" cy=".2" r=".2" style="display:inline"/>
|
|
<circle cx=".8" cy=".2" r=".2" style="display:inline"/>
|
|
<circle cx=".2" cy=".8" r=".2" style="display:inline"/>
|
|
<circle cx=".8" cy=".8" r=".2" style="display:inline"/>
|
|
</mask>
|
|
|
|
<mask id="maskNone" maskContentUnits="objectBoundingBox"
|
|
x="0" y="0" width="100%" height="100%" style="fill:white">
|
|
<circle cx=".2" cy=".2" r=".2" style="display:none"/>
|
|
<circle cx=".8" cy=".2" r=".2" style="display:none"/>
|
|
<circle cx=".2" cy=".8" r=".2" style="display:none"/>
|
|
<circle cx=".8" cy=".8" r=".2" style="display:none"/>
|
|
</mask>
|
|
</defs>
|
|
|
|
<rect x="65" y="360" width="80" height="70" style="fill:crimson; mask:url(#maskInherit)" />
|
|
|
|
<rect x="185" y="360" width="80" height="70" style="fill:crimson; mask:url(#maskInline)" />
|
|
|
|
<rect x="305" y="360" width="80" height="70" style="fill:crimson; mask:url(#maskNone)" />
|
|
|
|
</g>
|
|
|
|
<!-- ============================================================= -->
|
|
<!-- Batik sample mark -->
|
|
<!-- ============================================================= -->
|
|
<use xlink:href="../batikLogo.svg#Batik_Tag_Box" />
|
|
|
|
</svg>
|