index.html
<!DOCTYPE html> <html lang="zh-cn"> <head> <meta charset="utf-8"> <title>CSS边框与背景[下]</title> <link rel="stylesheet" type="text/css" href="style.css"> </head> <body> <div>我是<b>HTML5</b>，我是<b>HTML5</b>，我是<b>HTML5</b>，</div> <!-- <div>我是<b>HTML5</b>，我是<b>HTML5</b>，我是<b>HTML5</b>，</div> <div>我是<b>HTML5</b>，我是<b>HTML5</b>，我是<b>HTML5</b>，</div> <div>我是<b>HTML5</b>，我是<b>HTML5</b>，我是<b>HTML5</b>，</div> --> </body> </html>
style.css
@charset "utf-8";
/*html {
height: 100%;
}*/
body {
/*background-color: silver;*/
/*background-image: url(loading.gif);*/
/*background-image: none;*/
/*background-repeat: repeat-x;*/
/*background-repeat: repeat-y;*/
/*background-repeat: repeat;*/
/*background-repeat: no-repeat;*/
/*background-position: top;*/
/*background-position: right;*/
/*background-position: left;*/
/*background-position: bottom;*/
/*background-position: center;*/
/*background-position: right top;*/
/*background-position: left bottom;*/
/*background-size: cover;*/
/*background-size: 200px 200px;*/
/*background-size: 100%;*/
/*background-attachment: scroll;*/
/*background-attachment: fixed;*/
}
div {
width: 500px;
height: 300px;
/* background-color: silver;
background-image: url(img.png);
background-repeat: no-repeat;
background-position: bottom;*/
border: 10px dashed red;
padding: 50px;
/*background-image: url(loading.gif);*/
/*background-image: url(img.png);*/
/*background-size: cover;*/
/*background-size: contain;*/
/* background-repeat: no-repeat;
background-origin: border-box*/;
/*background-origin: padding-box;*/
/*background-origin: content-box;*/
/*background-clip: border-box;*/
/*background-clip: padding-box;*/
/* background-clip: content-box;*/
background: silver url(img.png) no-repeat top left / 100% border-box content-box;
}
/*div b {
background-color: red;
}
div b:first-child {
background-color: transparent;
}*/