1234567891011121314151617181920212223242526272829303132333435363738 |
- <!DOCTYPE html>
- <html lang="en">
- <head>
- <meta charset="UTF-8">
- <meta http-equiv="X-UA-Compatible" content="IE=edge">
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
- <title>Document</title>
- <style>
- div{
- /* 块级元素(自己占一行的元素) 宽度会充满父元素,高度由内容撑的 ,如果设置宽高后,会按照设置的宽高*/
- /* 宽高 */
- width:800px;
- height:800px;
- /* 背景是复合属性 */
-
- background-color: red;
- background-image: url(images/img01.jpeg);
- /* 背景重复 repeat(默认)|no-repeat */
- background-repeat: no-repeat;
- /* 背景图片位置: 水平 left|center|right 垂直top|center|bottom */
- background-position:center center;
- /* 合并写法 */
- /* background:red url(images/img01.jpeg) no-repeat -50px 80px; */
- }
- </style>
- </head>
- <body>
- <div>哈哈哈</div>
-
- </body>
- </html>
|