純粋なCSSを使用してdiv（四角形）の内側に透明な円を作成するにはどうすればよいですか？

Question

> 

1. 例

=======

iが他の要素の上DIV（長方形）（たとえば画像）【選択画像 が見えるだけであるべきことを配置する場合そのdiv（矩形）の内側の円を通過します。

Answer 1

Muhammadさんがあなたの質問に少し曖昧で（あまり整形されていない）コメントしましたが、clip-path CSSルールを使用してクリッピング "マスク"レイヤーの後にいるようですね？

ここでCSSクリップパスを紹介codependだ - http://codepen.io/chriscoyier/pen/02e4ebad4c8d3beeb0dc4781a811a37c

そしてHERESに対応する記事 - 私は考えることができるあなたの質問のhttps://css-tricks.com/clipping-masking-css/

唯一の他の解釈は上の基本的な国境半径ルールですオーバーフローをdivに設定したdiv。

.rectangle { 
    background-image: url(yourimage.jpg); 
    border-radius: 100px; 
    width: 100px; 
    height: 100px; 
} 

編集：コメントセクションにあなたの意図を示しました。 div要素の擬似要素を使用すると、クリッピングマスクを実現できます。

.rectangle { 
    position: relative; 
} 
.rectangle:after { 
    content: ""; 
    position: absolute; 
    left: 50%; 
    top: 50%; 
    transform: translate3d(-50%,-50%,0); 
    width: 30px; 
    height: 30px; 
    border-radius: 30px; 
    background-image: url(yourimage.jpg); 
    background-size: 200px 100px; 
}