그림자
생성도구 사용
css3 text shadow 기능을 제공하는 사이트를 통하여 테스트 후에 이 값을 읽어와 사용하면 보다 편리 합니다.
글자 뿐만 만 아니라 박스등에도 설정이 가능합니다.
그라디에이션
text-shadow
예제코드: ./sample/shadow01.html
첫번째 : x축 그림자 (+/-)
두번째: y축 그림자 (+/-)
세번째: 번지는 그림자 크기
네번째: 색상
포토샵 반영하기
rgb+알파 값을 색상으로 정의 합니다.
검정색의 알파값 50% 라고 하면 rgba()를 입력합니다.
포토샵의 distance
값을 x, y 그림자로 입력합니다.
size
값을 세번재 번지는 그림자 크기로 입력을 합니다.
여러개의 그림자 설정하기
콤마(,)를 통하여 여러개의 그림자를 동시에 적용할 수 있습니다.
text-shadow: 설정1, 설정2, 설정3;
실습: 무지개 그림자 만들기
예제코드: ./sample/shadow02.html