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

2017. 8. 28. 11:03·WEB/HTML
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
'WEB/HTML' 카테고리의 다른 글
  • HTML 태그 먹히지 않게 하기.
  • [HTML] HTML강의 - ch04
  • [HTML] HTML강의 - ch03
  • [HTML] HTML강의 - ch02
밍글링글링
밍글링글링
mingling - 밍글링, 밍글밍글링. 코드와 어우러지다. IT/ 프로그래밍/소스
    반응형
    250x250
  • 밍글링글링
    mingling
    밍글링글링
  • 전체
    오늘
    어제
    • 밍글링글링 (463)
      • Flutter (2)
      • 일상생활 (8)
        • 리뷰 (1)
        • 생활정보 (4)
        • 맛집 (0)
        • 여행 (0)
        • 모든정보 (3)
      • JAVA (126)
        • 개념 (6)
        • 예제 (115)
        • Exception (2)
      • C (1)
        • C (1)
        • C++ (0)
        • C# (0)
      • JS (29)
        • JavaScript (18)
        • JQuery (5)
        • AJax (0)
        • NODE.JS (6)
        • Angular.JS 2.0 (0)
      • WEB (87)
        • HTML (6)
        • CSS (61)
        • JSP (20)
        • JSTL (0)
      • FrameWork (8)
        • Spring (8)
        • BootStrap (0)
        • MyBATIS (0)
        • JUnit (0)
      • 외부 라이브러리 (5)
      • 공유 소스 관리 (5)
        • Git (5)
        • SVN (0)
      • 빅데이터 프로그래밍 (37)
        • Python (37)
        • R Programming (0)
      • DB (7)
        • ORACLE (0)
        • MySql (6)
      • Development Tools (7)
        • StarUML (0)
        • eXERD (0)
        • Eclipse (4)
      • SKILL (6)
        • Migration (0)
        • Security (6)
      • MicroSoft (0)
        • Excel (0)
        • Word (0)
      • Android (0)
      • Server (21)
        • Ubuntu (5)
        • Linux (15)
      • IOS (0)
      • XML (0)
      • 미디어 (0)
      • 공지사항 (3)
      • NETWORK (1)
      • 게임 (4)
        • 피파 (1)
        • 리니지M (0)
        • 배틀그라운드 (1)
        • 듀랑고 (2)
      • 세상 이슈 (6)
      • 일렉트론 (0)
      • 대회 소식 (4)
      • 업무 (2)
      • Express, Vue (6)
      • docker (11)
      • svelte (3)
      • 블록체인 (1)
      • IT (66)
      • Rust (0)
  • 블로그 메뉴

    • 홈
    • 태그
    • 미디어로그
    • 위치로그
    • 방명록
  • 링크

  • 공지사항

  • 인기 글

  • 태그

    자바 for문
    자바 배열
    lang rust
    css perspective
    css float
    jsp include
    API 설계
    docker
    자바 객체 지향
    vue cli
    오류
    Node
    VS Code 팁
    Extension Bisect
    java casting
    SSL 인증서
    React Compiler
    자바 exception
    프런트엔드
    proxy pass
    css table
    vscode
    티스토리 자동화
    spring java
    nginx
    svelte
    gitlab 설치
    자바 클래스
    mysql db
    vue 설치
    css tb
    rust linux
    ubuntu
    servlet class
    nginx ssl 설정
    ssl 인증서 발급
    브라우저 자동화
    AI 반도체
    Java Array
    클론코딩
    리눅스 설치
    css transition
    자바 생성자
    Rust lang
    제미나이
    에디터 팁
    nginx ssl 적용
    jsp parameter
    AI 코딩 에이전트
    러스트
  • 최근 댓글

  • 최근 글

  • hELLO· Designed By정상우.v4.10.6
밍글링글링
[HTML] SVG를 이용하여 색깔 그라데이션 넣기.
상단으로

티스토리툴바