ABOUT ME

-

  • 10. Shadow
    Front-end/CSS3 2020. 6. 6. 16:00
    /*text-shadow
    선택자 { text-shadow: Horizontal-offset Vertical-offset Blur-Radius Shadow-Color; }
    프로퍼티             값	    단위	설명	                                                            생략
    Horizontal-offset   px	    그림자를 텍스트의 오른쪽으로 지정값만큼 이동시킨다
    Vertical-offset	    px	    그림자를 텍스트의 아래로 지정값만큼 이동시킨다
    Blur-Radius	        px	    그림자의 흐림정도를 지정한다. 지정값만큼 그림자가 커지고 흐려진다. (양수)	가능
    Shadow-Color	    color	그림자의 색상을 지정한다	                                            가능
    */
    
    /*box-shadow
    선택자 { box-shadow: Inset Horizontal-offset Vertical-offset Blur-Radius Spread Shadow-Color; }
    프로퍼티 값	        단위	    설명	                                                                생략
    Inset	            inset	inset 키워드를 지정하면 그림자가 요소 안쪽에 위치한다.	                가능
    Horizontal-offset   px	    그림자를 텍스트의 오른쪽으로 지정값만큼 이동시킨다
    Vertical-offset	    px	    그림자를 텍스트의 아래로 지정값만큼 이동시킨다
    Blur-Radius	        px	    그림자의 흐림정도를 지정한다. 지정값만큼 그림자가 커지고 흐려진다. (양수)	가능
    Spread	            px	    그림자를 더 크게 확장시킨다. (음수, 양수)	                            가능
    Shadow-Color	    color	그림자의 색상을 지정한다	                                            가능
    */

    'Front-end > CSS3' 카테고리의 다른 글

    12. Transition  (0) 2020.06.06
    11. Gradient  (0) 2020.06.06
    9. Inheritance & Cascading  (0) 2020.06.06
    8. Float  (0) 2020.06.06
    7. Position  (0) 2020.06.06

    댓글

Designed by Tistory.