Chrome と Opera で角が丸い Overflow:hidden の問題を修正する方法?

Chrome および Opera における CSS3 の角丸とオーバーフロー マスキング

角丸を使用して子要素からオーバーフローするコンテンツを隠そうとすると問題が発生します親 div 上で。 overflow: hidden はほとんどのブラウザで機能しますが、Chrome や Opera などの WebKit ベースのブラウザでは、親要素が相対的または絶対的に配置されている場合に問題が発生します。

この問題を解決するために、親要素 (#wrapper) に対する WebKit CSS マスク。このマスクは単一ピクセルの PNG 画像を利用しており、CSS に直接埋め込むことで不要な HTTP リクエストを排除できます。この回避策を適用すると、オーバーフロー: 隠し機能が Chrome と Opera で復元され、丸い角を越えるコンテンツが効果的に隠蔽されます。

以上がChrome と Opera で角が丸い Overflow:hidden の問題を修正する方法?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。