IE9의 의사 요소에 대한 CSS 그래디언트

IE9의 유사 요소에 CSS 그래디언트를 설정하는 솔루션을 알고 있습니까? 그것은 필터처럼 보인다IE9의 의사 요소에 대한 CSS 그래디언트

이 의사 요소에 적용되지 않습니다 아니면 내가 뭔가를 놓친 :

이 내 접근 방식인가?

2011-09-27 Burntime

내가 의사 클래스가 무엇인지 알고있다. 의사 요소 란 무엇을 의미하는지 모르겠습니다. –

" ': before'의사 요소를 사용하여 요소의 내용 앞에 내용을 삽입 할 수 있습니다." (웹 사이트 : www.w3schools.com) – Burntime

@Peter Olson : 의사 요소는 생성 된 콘텐츠를 제공하거나 특정 콘텐츠를 기존 콘텐츠의 일부 순전히 디스플레이 및 스타일링 목적을 위해 존재합니다. 예를 들어 DOM에서 찾을 수 없습니다. http://www.w3.org/TR/css3-content/#pseudo-elements 및 http://www.w3.org/TR/css3-selectors/#pseudo-elements – BoltClock

네거티브 스프레드 반경을 설정하여 간단한 상자 그림자로 거의 동일한 효과를 낼 수 있습니다.

inset? && [ <offset-x> <offset-y> <blur-radius>? <spread-radius>? <color>? ]

CSS Shadow

예 : (http://jsbin.com/ekehoz/edit#html,live)

box-shadow: 0px -15px 30px -10px #888;

출처

2011-10-11 07:22:32 Burntime

이미지를 사용하십시오. IE9는 css 그라디언트 (-ms- 접두어는 IE10에서만 작동 함)를 지원하지 않으며 dap 필터 (exapmle 코드에서 사용한)는 성능 (버그)에 매우 좋지 않습니다.

또는 캔버스를 사용하여 그라디언트를 렌더링 한 다음 해당 그라디언트를 요소의 data-url 배경으로 설정할 수 있습니다.

SVG 그래디언트 배경을 사용할 수도 있지만 다른 브라우저에서 숨길 필요가 있습니다 (좋은 점은 ie9에 조건부 주석이 있음). 그들은 buggy도 있다는 것을 명심하십시오. 필터처럼 버그가 없습니다.

출처

2011-09-27 19:20:41 c69

을 참조하십시오. 볼 예제. 나는 몇 시간 동안 원하는 svg를 만들려고 노력하고있다. 이상적으로는 80deg라고 말한 간단한 선형 그래디언트를 100 % 너비와 높이로 채우고 base64 svg + xml 배경 이미지로 설정할 수 있습니다. 나는 이것이 당신에게 물어볼 일이 많다는 것을 알고 있지만, 몇 가지 예를 가르쳐 주시겠습니까? 아니면 적어도이 해결책의 일부분을 제공 할 수 있습니까? – bodine

@ bodine 만약 당신이 여전히 관련성이 있다면 (거의 1 년 후에), 예전의 [지뢰 찾기 게임] (http://vesna.in.ua/minesweeper)과의 링크가 있습니다. 타일은 캔버스를 통해 생성됩니다. – c69

IE9의 의사 요소에 대한 CSS 그래디언트

답변

관련 문제