html - すべての CSS プロパティがカスケード ダウンできるわけではありませんか、それとも一部のタグは親からのプロパティを無視しますか?

Question

私のHTML

<div class="teaser">
<img src="smiley.gif">
</div>

私の CSS では、border-radius: 100% を画像に適用しようとしているので、円のように見えます。私がする時

.teaser{ border-radius: 100%; }うまくいきませんが、うまく.teaser img{ border-radius: 100%; }いきます。理由は何ですか？これは、border-radiusプロパティをカスケード ダウンできないためですか、それともimgタグが親からのプロパティを無視するためですか。

Answer 1

デフォルトで継承されるプロパティ

border-collapse
border-spacing
caption-side
color
cursor
direction
empty-cells
font-family
font-size
font-weight
font-style
font-variant
font
letter-spacing
list-style-type
list-style-position
list-style-image
list-style
line-height
orphans
page-break-inside
quotes
text-align
text-indent
text-transform
visibility
white-space
widows
word-spacing

ソース：impressionwebs.com/

Answer 2

border-radius継承されません

継承されているかどうかを確認できるように、CSS プロパティのリストを次に示します: http://www.w3.org/community/webed/wiki/CSS/Properties

Answer 3

これを試して

CSS

.teaser {
   border-radius: 100%;
   overflow: auto;
   display: table-caption;
}

HTML

<div class="teaser">
    <img src="http://lorempixel.com/output/animals-q-c-189-137-4.jpg">
</div>

デモ