Hiển thị hình nền thông qua các div chồng chéo trong HTML & CSS

Question

Có thể cho tôi biết liệu kịch bản dưới đây có thể đạt được với HTML và CSS không? Mục tiêu của tôi là hiển thị hình nền của cơ thể HTML của tôi thông qua một div bị cắt bớt.

Hãy nhớ rằng trang web chính thức sẽ được đáp ứng (điện thoại di động đầu tiên), vì vậy giải pháp nên cho phép các vị trí khác nhau của hình ảnh body background khi thay đổi kích thước.

Về cơ bản: có cách nào để hiển thị div như một phần giới thiệu của div cơ bản không?

Tôi nghĩ đến việc cung cấp hình nền riêng biệt cho mỗi vòng tròn để hiển thị ảo giác rằng các vòng tròn hiển thị nền thân máy, nhưng khi thiết kế đáp ứng, các vấn đề căn chỉnh sẽ nhanh chóng xảy ra.

Mọi thông tin chi tiết? Vui lòng cho tôi biết nếu cần thêm dữ liệu. Cảm ơn trước.

Answer 1

Tôi nghĩ rằng đây là tương tự:

http://ask.webatall.com/html5/7619_transparent-half-circle-cut-out-of-a-div.html

và cần giúp đỡ? Thay vì hình dạng bạn phải sử dụng vòng kết nối, nhưng nguyên tắc phải giống nhau. Ngoài ra, nếu nó không hoạt động kết hợp 2 yếu tố với nửa vòng tròn cắt ra có thể đạt được hiệu quả.

Câu trả lời này làm một điều tương tự với hình dạng khác:

http://www.samhohce.net/questions/30259780/onhover-button-cut-out-a-triangle-and-show-background