Trung tâm cá nhân
sách gpt4 ăn đã đi

safari - Safari 和 Mobile Safari 是否会错误地渲染带有半径和填充的圆形边框？

In lại 作者：技术小花猫 更新时间：2023-10-29 11:01:36 29 4
mua khóa gpt4 giày nike

Safari 和 Mobile Safari 在组合边框半径、填充和边框时似乎有问题。在 Chrome 和 Firefox 中运行良好。

Expected Outcome <-- 预期的

Safari Rendering <-- Safari 渲染

HTML:


CSS:

img {
    chiều rộng: 200px;
    chiều cao: 200px;
    -webkit-border-radius: 500px;
    -moz-border-radius: 500px;
    border-radius: 500px;
    đệm: 3px;
    border: 1px solid #999;
    margin: 10px
}

Ví dụ:http://jsfiddle.net/ucNwx/2/

是我的错还是 Safaris 的错？我该如何解决？

câu trả lời hay nhất

我敢打赌这是 Safari 的错误:bán kính đường viền 应用晚了并且会产生剪裁效果。幸运的是，box-shadow 被正确渲染了，所以让我们使用它:

border-radius: 50%;
box-shadow:
  0 0 0 3px white,
  0 0 0 4px #999;

Works在 iPad 和 OS X 上的 Safari 6 上。

关于safari - Safari 和 Mobile Safari 是否会错误地渲染带有半径和填充的圆形边框？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/14444806/

29 4 0
Đề xuất bài viết: css - 如何强制嵌套列表项与父列表项的宽度相同？
Đề xuất bài viết: ios - 每个目标不同的 Storyboard本地化
Đề xuất bài viết: css - 使用 feColorMatrix 匹配 SVG 中的颜色
Đề xuất bài viết: javascript - 如何修复 "If playback doesn' t 很快开始，尝试在 iPad 上使用 Youtube iFrame API 重新启动您的设备？
技术小花猫
Hồ sơ

Tôi là một lập trình viên xuất sắc, rất giỏi!

Nhận phiếu giảm giá taxi Didi miễn phí
Phiếu giảm giá taxi Didi
Các bài viết phổ biến trên toàn bộ trang web
Chứng chỉ ICP Bắc Kinh số 000000
Hợp tác quảng cáo: 1813099741@qq.com 6ren.com
Xem sitemap của VNExpress