[text] CSS - text-fill-color 속성 (비표준) - 텍스트글자색 (= 글자전경색 =text-fill-color속성 = 텍스트필컬러속성)

목차

1. text-fill-color 예제 - 글자 전경색
2. text-fill-color 정의
3. text-fill-color 관련 주소

※ 별로 안 씀. ㅡㅡ;

text-fill-color 예제 - 글자 전경색

<style>

body {

  width: 100%;

  height: 100vh;

  display: flex;

  align-items: center;

  background-color: #141414;

}

h1 {

  font-size: 9vw;

  font-weight: 700;

  font-family: 'Rubik', sans-serif;

  flex: 1;

  position: relative;

  text-align: center;

  margin: 0;

  -webkit-text-fill-color: transparent;

  background-image: url("http://66.media.tumblr.com/9d5be60c175cdbe15e875fef01b9a66b/tumblr_ntz3mmEFFr1twd8ddo1_500.gif");

  background-size: cover;

  -webkit-background-clip: text;

  background-repeat: no-repeat;

}

 

</style>

<h1>Homzzang.com</h1>

결과보기

text-fill-color 정의

 

글자 전경색 지정.

 

---

 

1.

비표준. 접두어 -webkit- 붙여야 함.

 

2.

IE 제외한 주요 최신 브라우저 모두 지원.

 

text-fill-color 관련 주소

 

mdn text-fill-color 강의