본문 바로가기

웹표준을 따르지 않아 디자이너와 개발자들에게 고칫덩어리인 IE6~8까지의 버전에 대해 CSS3의 일부기능을 사용할 수 있게 해주는 라이브러리인 PIE의 사용법입니다.

PIE가 CSS3의 모든 표현을 구현하려고 노력은 하고 있으나 아직은 일부에 대해서만 지원이 가능합니다.

 

 

 

PIE에서 사용 가능한 기능들은 아래와 같습니다.

  • border-radius
  • box-shadow
  • background 의 linear-gradient

그리고 적용을 위해서는IE9이하 버전에 대해  PIE.js를 불러와야 하고

해당 스타일에는  behavior: url(PIE.htc); 라는 스타일 코드를 붙혀야 합니다.

그리고 서버에는 PIE.js와 PIE.htc가 업로드 되어 있어야 합니다.

 

아래는 HTML코드작성 예제입니다.

 

<HEAD>

 <!--[If lt IE 9]>
    <script src="js/PIE.js"></script>
 <![endif]-->

 <STYLETYPE="TEXT/css">
  #PIEBOX {
    background: #FFF;
    padding: 1em;
    -moz-border-radius: 1em;
    -webkit-border-radius: 1em;
    border-radius: 1em;

    behavior: url(PIE.htc);
  }
 </STYLE>
</HEAD>

 

좀더 자세한 내용은 해당 홈페이지를 참조하세요

http://css3pie.com

 

 

 

 

 

 

JOS39 블로그

여행과 맛집 그리고 일상에 대해 나만 몰랐던 이야기들..