CSS图片分割

背景图片:

样式表:

<style type="text/css">
/*图片分割样式*/
    .custom_ui {
        background-image: url('../Images/Custom_Icons.jpg');
        background-repeat: no-repeat;
        width: 30px;
        height: 30px;
        display: block;
        overflow:hidden;
        text-indent:-9999px;
    }
/*自定义图片的起始位置: Left Top*/
    .define_user {
        background-position: -90px -10px; 
    }
    .define_lock {
        background-position: -90px -210px; 
    }
    .define_refresh {
        background-position: -450px -50px; 
    }

</style>
Style

 

使用:

<!-- 图片分割 -->
    图片切割
    <div class="custom_ui define_user">  </div>
    <div class="custom_ui define_lock">  </div>
    <div class="custom_ui define_refresh">  </div>

 

 

 

 

posted @ 2014-06-11 23:05  南宫元耘  阅读(545)  评论(0)    收藏  举报