2011-09-11 5 views
3

브라우저가 지원하지 않는 경우를 대비하여 rgb 값으로 작업하는 크로스 브라우저 그라데이션 효과를 사용하고 싶습니다.rgb/rgba 및 fallbacks가있는 CSS3 Crossbrowser 그라디언트 배경

jsFiddle 예 : http://jsfiddle.net/HelloJoe/hUxdh/

나는 대부분의 브라우저를 다루었 생각하지만, 나는 몇 가지 질문이 있습니다 일반적으로 사용되는 내가 놓친 다른 브라우저

  1. 있습니까를 iPads/SmartPhones와 같은 장치에 필요한 속성이나 현재 사용되는 속성 중 하나에서 렌더링 할 속성은 무엇입니까?

  2. 그래디언트가 렌더링되지 않은 경우 원래 색이 단색이어야합니다. background: rgb(50, 50, 50);? filter

  3. , 나는 rgb 값을 사용하여 작업을 얻을 대신 hex 값을 사용하여에 의존했다 없습니다, 이것은 큰 문제입니다,하지만 rgb 값을 사용에 나는 시도하고하지 않는 것이 . 이 둘 사이에 방법이 있을까요 아니면 그냥 받아들이지 않을까요?

  4. 나는 알파 투명도를 렌더링하지 다시 내가 다음 rgba 그라데이션 배경 값, 가을로 rgb 그라데이션 배경 값을 가질 필요가 대신 rgbrgba을 사용하고 단색 배경이 경우에 다시 하락했다 경우 그라데이션이 전혀 렌더링되지 않았습니까? 아니면 브라우저가 알파 투명도 값을 무시하고 별도의 rgb 배경을 사용하지 않고 rgbargb을 표시하겠습니까?

  5. 마지막으로 모든 것을 되돌려 놓으면 CSS 속성의 시작 부분에 hex 값을 설정해야할까요? 나는 아무런 해를 끼치 지 않고 hex 값을 더하는 것으로 생각하지만 rgb을 사용한다는 생각은 rgba을 사용할 수 있다면 사이트 전체에서 빠르고 쉽게 색상을 변경할 수 있다는 것입니다. 따라서 hex 값을 다시 사용하면 rgb/rgba을 쓸모 없게 만들 것입니다. 그 이유는 어쨌든 모든 hex 값을 편집해야 할 필요가 있기 때문입니다.

내가 검색을 조금 해봤 예 달라, 이해는 다른 사람 사이에 오해하고 그냥 원하는 결과를 얻기의 정확한 작업 예제를 만들려고했다.

답변

6

내가 당신의 그라디언트와 함께 당신을 도울 당신이 웹 사이트를 제안하고 폴백 수 :
확실히 놀라운 생성기입니다 http://www.colorzilla.com/gradient-editor/

+0

는, 대단히 사이먼 감사합니다! 브라우저가'rgba'를 읽지 않는다면'rgb' 값을 읽고 알파 투명도를 무시하는 것과 같은 몇 가지 질문이 여전히 있습니다. 또한 궁극적 인 후퇴로 '육각'가치가 필요합니까? – Joe

+0

@JoeMottershaw Colorzilla의 궁극적 인 그라디언트 편집기 캔트에 대한 나의 사랑은 그렇게 (+1) 측정 할 수 없지만, 둥근 모서리와 그림자 같은 다른 것들을 사용하려는 경우가있을 수 있으므로 http : // www. css3pie.com - 웹 사이트 자체는 그림자와 둥근 모서리가 어떻게 작용하는지 보여주는 데모입니다. – Joonas