HTML & CSS

CSS - grapic

3jun 2018. 7. 11. 18:54

배경 ( back-ground ) 

back-ground-image: url(' ');

back-ground-repeat: (no-repeat / repeat / repeat-x / repeat-y );

background-attachment: (scroll / fixed);

background-size: (cover / contain);

background-position: ( bottom/center/left/right/top | bottom/center/left/right/top );

 

 

 

필터 ( filter )

어떤 이미지, 텍스트 등 그래픽 대상에게 다양한 효과를 줄 수 있는 기능이다.

컬러 이미지를 흑백이미지로 바꾼다던지, 뿌옇게 처리한다던지 등등

포토샵이나 기타 그래픽 프로그램들이 코드화 되었다고 생각하면 무난하다.

원본이미지를 그대로 유지하면서 코드를 통해 효과를 주는 것이다. 

 

CSS Filters Playground

 

위 사이트를 들어가면 CSS에서 filter 를 통해 구현할 수 있는 기능들을 확인할 수 있다. 

어떤 브라우저에서는 지원을 하지만 어떤 브라우저에서는 시험적으로 사용을 하고 있기 때문에 Vender prefix를 입력해야한다.