IE에서 "테두리 반경"지원

158

Internet Explorer가 "테두리 반경"CSS 속성을 지원하는지 여부를 아는 사람이 있습니까?

internet-explorer  css 
— 토니 포니
소스

답변:

220

예! IE9가 2011 년 1 월에 출시 될 때

4면 모두에서 15 픽셀을 원하는 경우를 가정 해 보겠습니다.

.myclass {
 border-style: solid;
 border-width: 2px;
 -moz-border-radius: 15px;
 -webkit-border-radius: 15px;
 border-radius: 15px;
}

IE9는 기본값을 사용 border-radius하므로 테두리 반경을 호출하는 모든 스타일에 포함시켜야합니다. 그런 다음 사이트가 IE9를 준비합니다.

-moz-border-radiusFirefox 용, -webkit-border-radiusSafari 및 Chrome 용입니다.

또한 IE 코딩을 ie9로 선언하는 것을 잊지 마십시오.

<meta http-equiv="X-UA-Compatible" content="IE=9" />

게으른 개발자들도있다 <meta http-equiv="X-UA-Compatible" content="IE=7" />. 해당 태그가 있으면 IE에서 테두리 반경이 작동하지 않습니다.

— 케빈 플로리다
소스
7
아마도 X-UA 호환 메타 태그를 사용하지 않는다면 IE9에서 작동시키기 위해 추가 할 필요가 없습니까?
— theeper
72
브라우저가 실제 표준을 지원하는 경우 공급 업체 접두사 버전 대신이를 사용하도록 공급 업체 접두사 버전을 FIRST 및 표준 LAST로 설정해야합니다.
— Jason Berry
4
메타 태그가 필요하지 않습니다. ie7 에뮬레이터 (포함 된 경우) 만 교체하면됩니다. 그렇지 않으면 걱정하지 마십시오.
— Kevin Florida
3
현재 IE9 베타 '테두리 반경'의 FYI는 단일 값을 사용하여 올바르게 작동합니다. 실제로 다른 값을 원하지 않는 한 네 가지 값이 모두 필요하지는 않습니다.
— mikemaccana
2
@nailer : 모서리를 업데이트 해 주셔서 감사합니다. IE9의 첫 번째 알파 대 및 베타 대는 4 개의 모서리를 모두 선언해야합니다. 방금 최신 ie9 RC를 다운로드했는데 하나의 값을 선언 할 수있게되었습니다. 언제 변경되었는지 확실하지 않습니다.
— Kevin Florida
46

이 질문에 대한 답변은 1 년 전에 요청 된 이후로 변경되었습니다. (이 질문은 현재 인터넷 검색 "테두리 반경"의 최상위 결과 중 하나입니다.)

IE9가 지원 border-radius합니다.

플랫폼 미리보기가 사용할 수 있는 지원은 border-radius . 미리보기 (및 릴리스 될 때 IE9)를 실행하려면 Windows Vista 또는 Windows 7이 필요합니다.

— 데이비드 존스턴
소스
18

해결 방법과 편리한 도구 :

CSS3Pie 는 .htc 파일과 behavior 속성을 사용하여 CSS3를 IE 6-8로 구현합니다.

모 더니 저 은 HTML 요소에 클래스를 넣는 약간의 자바 스크립트로, 기능에 따라 다른 브라우저에 다른 스타일 정의를 제공 할 수 있습니다.

분명히, 이것들은 더 많은 오버 헤드를 추가하지만 Vista / 7에서만 실행되는 IE9에서는 꽤 오래 걸릴 수 있습니다. 2010 년 8 월 현재 Windows XP는 여전히 웹 클라이언트 OS의 48 %를 차지합니다.

— 피터 G
소스
2
CSS3 PIE는 지금까지 가장 쉽고 침입이 적은 옵션이었습니다.
— Chris Rasco
12

IE8에는 계획되어 있지 않습니다. 참고 항목 CSS 호환성 페이지를 .

그 외에는 계획이 발표되지 않았습니다. IE8이 Windows XP 의 마지막 버전 이라는 소문 이 있습니다.

— 벤 S
소스
12
IE9가 CSS3도 지원해야하기 때문에 분명히 잘못되었습니다 .IE는 어디에서나 죽어가는 것을 보지 못합니다. 누군가 pls는 IE를 죽인다
— Starx
10
IE8이 Windows XP의 마지막 버전이라는 것이 밝혀졌습니다.
— M. Dudley
7

<!DOCTYPE html> 이 태그가 없으면 border-radius는 IE9에서 작동하지 않으므로 메타 태그가 필요하지 않습니다.

— JAVAC
소스
4

사용 -ms-border-radius: 15px, 사용이 -ms-를 CSS 것을 모든 요소는 IE와 호환됩니다.

— 이아고 브루노
소스
2

테두리 반경 및 배경 그라디언트 지원은 어떻습니까? 예 IE9는 둘 다 별도로 지원하지만 둘을 혼합하면 둥근 모서리에서 그라디언트가 번집니다. 아래는 나쁜 예에 대한 링크이지만 내 테스트에서도 볼 수 있습니다. 스크린 샷을 찍어야합니다 :(

실제 문제는 IE가 MS-FILTER 독점 해킹없이 CSS 표준을 언제 지원할 것인가입니다.

http://frugalcoder.us/post/2010/09/15/ie9-corner-plus-gradient-fail.aspx

— 시그마 베타
소스
IE10은 올바른 CSS3 그라디언트를 지원합니다 (현재 IE10 개발자 미리보기는 이미 -ms-linear-gradient를 통해 수행됨). IE9에서 경계 반경을 따르는 그라디언트를 원한다면 SVG (외부 SVG 파일 또는 데이터 URI로 인코딩 된 파일)를 사용해야합니다. css3wizardry.com/2010/10/29/css-gradients-for- ie9 -CSS3 PIE도 곧 자동화 할 것입니다. 테스트 빌드도 있습니다
— lojjic
빠른 수정은 다른 요소로 감싸는 것입니다. 부모 요소에 동일한 경계 반경을 부여하고 오버플로를 숨김으로 설정하십시오.
— Senne
1

해결-IE 10 및 11에서 테두리 반경을 올바르게 렌더링하지 않음

IE 10,11에서 작동하도록 -ms-border-radius : 또는 border-radius :를 얻지 못하는 사람들은 모든 사각형을 렌더링 한 다음 다음 단계를 따르십시오.

  1. IE 브라우저의 오른쪽 상단에있는 톱니 바퀴를 클릭하십시오
  2. 호환성보기 설정을 클릭하십시오
  3. 이제 기본적으로 선택되어있는 2 개의 상자를 선택 해제하십시오.

상자가 그림과 같이 선택 해제되어 있는지 확인하십시오

— 앨런 스타
소스
당사 사이트를 사용함과 동시에 당사의 쿠키 정책과 개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.