目次 |
---|
・<svg>要素とCSS ・CSS3メソッド |
<svg>要素は、CSS(Cascading Style Sheets)は密接な関係を持っています。
各図形要素の線(stroke)や塗りつぶし(fill)など、スタイルを示す属性は、必要に応じてCSSで定義することができます。
<rect fill="red" stroke="blue" />
<rect style="fill:red;stroke:blue;" />
<svg id="svg0101" width="500" height="200"> <rect id="red_rect" class="blue-box" /> </svg> <style> svg { background-color : silver; } rect { stroke-width : 2px; } #red_rect { fill : red; } .blue-box { stroke : blue; } </style>
<link href="style.css" rel="stylesheet" type="text/css" media="all" />
<svg>要素に対してCSS3プロパティが適用出来るものは少ないです。
しかし、半透明など一部のCSS3メソッドを適用することは可能です。