css background实例

最新推荐文章于 2024-04-04 02:15:35 发布

weixin_30900589

最新推荐文章于 2024-04-04 02:15:35 发布

阅读量104

点赞数

原文链接：http://www.cnblogs.com/xutongbao/p/9924940.html

版权

<!DOCTYPE html>  
<html>  
<head>  
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
    <title>background</title>  
    <style type="text/css">
        .my-style {
            width: 100%;
            height: 200px;
            background-image: url("http://www.runoob.com/try/demo_source/gradient2.png");
            background-repeat: repeat-x;
            border: 1px solid #ddd;
            margin-bottom: 5px;
        }
        .my-style2 {
            width: 100%;
            height: 400px;
            background-image: url("http://www.runoob.com/try/demo_source/img_tree.png");
            background-repeat: no-repeat;
            background-position: right top;
            border: 1px solid #ddd;
            margin-bottom: 5px;
        }
        .my-style3 {
            width: 100%;
            height: 400px;
            background: #8cd6f5 url("http://www.runoob.com/try/demo_source/img_tree.png") no-repeat center bottom;
            border: 1px solid #ddd;
            margin-bottom: 5px;
        }    
        .my-style4 {
            width: 100%;
            height: 400px;
            background: #8cf599 url("http://www.runoob.com/try/demo_source/img_tree.png") no-repeat center bottom;
            background-size: 100px 250px;
            background-position-y: 20px;
            border: 1px solid #ddd;
            margin-bottom: 5px;
        }              
    </style>
</head>  
<body>
    <div class="my-style"></div>
    <div class="my-style2"></div>
    <div class="my-style3"></div>
    <div class="my-style4"></div>
</body>  
</html>

转载于:https://www.cnblogs.com/xutongbao/p/9924940.html

weixin_30900589

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
css background实例

<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>background</title> ...
复制链接

扫一扫