http://css3pie.com을 사용하여 IE에서 둥근 모서리를 구하는 방법을 사용하려고합니다. 페이지가로드 될 때로드되는 내 CSS에 다음을 포함 시켰습니다. 이 모든 것이 Joomla 1.5에로드되고 있습니다.IE3에서 CSS3PIE가 전혀 작동하지 않습니다.
.form_field {color:#222 !important; border:2px solid #333; background:#f4f4f4;-webkit- border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px; color:#fff; padding:2px 0px 2px 0px; position:relative; z-index:99999;
behavior: url(./PIE.htc);
위의 코드는 template.css라는 CSS 파일에 보관되어 있습니다.
PIE.htc 및 PIE.php는 내 웹 사이트의 루트에 있습니다.
아래는 IE 8 렌더링 모드로 선택된 렌더링을 사용하여 IE 9에서 페이지를로드 할 때 생성되는 '보기 소스'중 일부입니다.
<link rel="stylesheet" href="/sos/plugins/system/rokbox/themes/light/rokbox-style.css" type="text/css" />
<link rel="stylesheet" href="/sos/components/com_gantry/css/gantry.css" type="text/css" />
<link rel="stylesheet" href="/sos/components/com_gantry/css/grid-12.css" type="text/css" />
<link rel="stylesheet" href="/sos/components/com_gantry/css/joomla.css" type="text/css" />
<link rel="stylesheet" href="/sos/templates/sos/css/joomla.css" type="text/css" />
<link rel="stylesheet" href="/sos/templates/sos/css/customstyle.css" type="text/css" />
<link rel="stylesheet" href="/sos/templates/sos/css/extended.css" type="text/css" />
<link rel="stylesheet" href="/sos/templates/sos/css/sos-styles.css" type="text/css" />
<link rel="stylesheet" href="/sos/templates/sos/css/template.css" type="text/css" />
<link rel="stylesheet" href="/sos/templates/sos/css/typography.css" type="text/css" />
<link rel="stylesheet" href="/sos/templates/sos/css/fusionmenu.css" type="text/css" />
<script type="text/javascript" src="/sos/components/com_gantry/js/mootools-1.2.5.js"></script>
<script type="text/javascript" src="/sos/plugins/system/rokbox/rokbox-mt1.2.js"></script>
<script type="text/javascript" src="/sos/plugins/system/rokbox/themes/light/rokbox-config.js"></script>
당신은 내가 크롬에 들어갈 경우 CSS3 국경 반경 코드가 나는 파일이로드 알 수 있도록 실행,로드되는하여 template.css 파일 위에서 볼 수 있듯이. 어떤 이유로 IE에서 페이지를 볼 때 원형 동작이 작동하지 않습니다. 어떤 이유에서든 모서리는 사각형으로 남습니다. -S. 그들은 'form_field'클래스를 가지고있는 것처럼 보여도. 나는 CSS3PIE 웹 사이트의 문제 해결 문서를 훑어 보았지만 어떤 해결책을 찾지 못하는 것 같습니다.
편집 >>>>>>>>>>>>>>>>>>>>>>>> 나는 심지어 내 사이트의 루트에 자신의 CSS 파일에 넣어 시도
: 소스보기에서 클릭
는 CSS 파일을로드, 그래서 즉, CSS 파일 내부에 나는 "UTF-8"@charset 한 노력 알고 -S :
/* CSS Document */
.form_field {border-radius: 5px !important; color:#fff !important; padding:2px 0px 2px 0px !important; position:relative !important; z-index:99999 !important;
behavior: url(./PIE.htc) !important;}
그래서 내가 지금 생각할 수있는 유일한 방법은, 줌라 뭔가를 제거한다, 또는 다른 무언가와 충돌하는 것입니다.
편집 2 >>>>>>>>>>>>>>>>>>>>
좋아, 여전히 이동, 나는에 내 index.php에에서 모든 JS 파일을 주석 없었다 아무 것도 그것과 충돌 할 것임에 틀림 없다.
EDIT 3 >>>>>>>>>>>>>>>>>>>>
마지막으로!, 다른 사람의 이익을 위해 여기 줌라와 CSS3PIE으로이 작업을 수행하는 방법이다. PIE.htc와 함께 작동하지 않는 이유는 모르겠지만 대신 PIE.php를 사용하면이 방법이 효과적입니다.
가 넣어 내부 사이트 루트에 넣고, PIE.CSS라는 CSS 파일을 확인하십시오
@charset "utf-8";
/* CSS Document */
.YOURCLASSNAME {border-radius: 5px !important; color:#fff !important; padding:2px 0px 2px 0px !important; position:relative !important; z-index:99999 !important;
behavior: url(./PIE.php) !important;}
다음 템플릿 index.php 파일을 열고 넣어
<link rel="stylesheet" type="text/css" href="./PIE.css" />
다음 스타일에 맞게 이동하십시오. 예를 들어 기사의 일부 양식 필드는 스타일링을 원하는 모든 필드/div 등에 class = "YOURCLASSNAME"을 입력하십시오.
그러면 손가락이 교차해야합니다. :-)
'behavior : url (./ PIE.htc);'PIE.htc가 제대로 발견되었는지 확인하십시오. 파일이 내 웹 사이트의 루트에 있으면 – Murtaza
은 ./PIE.htc입니다. , 파일이 있지만 작동하지 않는 것 같습니다. – user1148760
이 웹 사이트의 루트에 있다면'/ PIE.htc'를 수행하고 점을 제거해야합니다. – pduersteler