階段効果のみOS Xに傾斜背景線形勾配（ギザギザ）

この画面this live pageのステージ一部です。

私が行うのは、グラデーションを一切持たない、角度と2色（主に2色目は透明です）の直線勾配で背景を作ることです。

Windowsではこの問題は発生しません。それは私のMac OS Xのブラウザでのみ発生するようです。（クロム53、2013年後半 '' のMac OS X 10.11.6、MBPr 15のSafari 9.1.2、Firefoxの49）

background: linear-gradient(7deg, @color1 50%, transparent 50%);

が、私は角度の付いたラインを実装するために完全に異なるアプローチを捜しているわけではない

Mac OS Xブラウザでlinear-gradientの階段を取り除くためにできることがあるかどうか不思議です。

出典

2016-10-26 kater louis

ハードストップ付きの傾斜リニアグラデーションを使用すると、これは（OS Xだけでなく他のものも同様に）発生することが知られています。ここに記載されたアプローチを試してください - http://stackoverflow.com/questions/33091401/background-image-linear-gradient-jagged-edged-result-needs-to-be-smooth-edged/33094994#33094994 – Harry

まあ、..しかし、これはまさに私が望まないものです。私はそこに直線が必要です - クリップパスのソリューションは私が以前持っていたものですが、クリップパスの悪いサポートのリニアグラデーションの背景に切り替えました。 –

カラーストップポイントをちょっとだけ使うと、エフェクトが損なわれません。線形勾配（7deg、@ color1 50％、transparent 50％）を使う代わりに、 'linear gradient（7deg、@ color1 49.9％、transparent 50.1％）'を使ってみてください。それはより滑らかでなければならず（まだ完全ではない）、階段効果の代わりに線でなければならない。 – Harry

使用

.myclass { 背景：@color。/*グラデーションをサポートしていないブラウザの場合/ 背景：-webkit-linear-gradient（7deg、@ color1 50％、transparent 50％）;/ Safari 5.1〜6.0の場合/ バックグラウンド：-o-linear-gradient（7deg、@ color1 50％、transparent 50％）;/ Opera 11.1〜12.0の場合/ バックグラウンド：-moz-linear-gradient（7deg、@ color1 50％、transparent 50％）;/ Firefox 3.6〜15の場合/ 背景：直線勾配（7deg、@ color1 50％、transparent 50％）;/標準構文*/ }

出典

2016-10-26 09:53:41 Rob

'@ color1'を除いて私が何をしたのかは分かりません。そして、' currentColor'のために問題は発生しません - 次にあなたの解決策を説明してください。 –

階段効果のみOS Xに傾斜背景線形勾配（ギザギザ）

答えて

関連する問題