表示エリア指定
border-box
★border-box
padding-box
★padding-box
content-box
★content-box
<![CDATA[
-HTML-
<div id="border-box"><span>★border-box</span></div>
<div id="padding-box"><span>★padding-box</span></div>
<div id="content-box"><span>★content-box</span></div>
-CSS-
div {
width: 300px;
border: solid 30px rgba(255,164,255,0.7);
padding: 30px;
background: url(pulu.jpg);
}
#border-box{
background-clip:border-box;
background-size:contain;
}
#padding-box{
background-clip:padding-box;
background-size:contain;
}
#content-box{
background-clip:content-box;
background-size:contain;
}
]]>