WEB/HTML

[HTML] SVG를 이용하여 색깔 그라데이션 넣기.

밍글링글링 2017. 8. 28.
728x90

 

<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100%">
    <defs>
        <linearGradient id="grad1" x1="0%" y1="0%" x2="100%" y2="0%">
            <stop offset="0%" style="stop-color:#9357cc;stop-opacity:1" />
            <stop offset="50%" style="stop-color:#2989d8;stop-opacity:1" />
            <stop offset="100%" style="stop-coloR:#2cc99d;stop-opacity:1" />
        </linearGradient>
    </defs>
    <text fill="url(#grad1)" font-size="50" font-family="Verdana" x="0" y="100">
        IE9도 지원하는 TEXT 그라데이션.
    </text>
</svg>

 

결과)

 

728x90

'WEB > HTML' 카테고리의 다른 글

HTML 태그 먹히지 않게 하기.  (0) 2018.05.04
[HTML] HTML강의 - ch04  (0) 2017.08.22
[HTML] HTML강의 - ch03  (0) 2017.08.22
[HTML] HTML강의 - ch02  (0) 2017.08.22
[HTML] HTML강의 - ch01  (0) 2017.08.22

댓글