[SVG] Animating "from" and "to" properties in CSS

[Mad_Griffith]

Hi, how do I replace the "animate" tag with CSS code?

    <svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg"    xmlns:xlink="http://www.w3.org/1999/xlink">        <line class="diagonal-line" x1="0" y1="0" x2="0" y2="0" style="stroke:rgb(255,255,255);stroke-width:1;" >            <animate attributeName="x2" from="0" to="100%" begin="1s" dur=".5s" />            <animate attributeName="y2" from="0" to="100%" begin="1s" dur=".5s" />        </line>    </svg>

It's not clear what the CSS declarations for the "from" and "to" attributes are...