雪碧图效果出不来-慕课网

首页课程实战体系课手记专栏慕课教程

雪碧图效果出不来

来源：4-1 编程挑战

出世Sunny

2015-10-22 12:49

不知道问题到底在哪里，感觉差了点什么，但找不到。

写回答关注

3回答

Y_du: 2015-10-22 13:14:41

已采纳

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
*{margin:0;padding:0;}
.wrap{
    width:200px;
    padding:5px 10px;
    background:lightblue;
   }
label{font-size:12px;margin-right:50px;}
a{color:blue;font-size:12px;}   
.block{
    width:190px;
    height:38px;
    margin:10px 0;
    font-size:15px;
    text-indent:2em;
    }   
    
.button input{
        background-image:url(http://img.mukewang.com/539a972b00013e9102280177.jpg);
        height:38px;
        width:190px;
        margin:10px 0;
   }

.button > .c1{background-position:0 0;}
.button > .c2{background-position:0 -38px;}
</style>
</head>

<body>
<div class="wrap">
    <form>
        <input class="block" placeholder="邮箱/手机号/用户名">
        <input class="block" type="password" name="密码" placeholder="请输入密码">
        <input type="checkbox" name="自动登录"><label>下次自动登录</label>
        
        <a>忘记密码?</a>
    
   
        <div class="button">
        <input class="c1" type="button">
        <input class="c2" type="button">
        </div>
    </form>
    
</div>
    
</body>
</html>

按钮的颜色是不一样的。

.button > .c1{background-position:0 0;}
.button > .c2{background-position:0 -38px;}

修改一下这里就好了。

.button c1{background-position:0 0;}

css是没有这样的写法的。

1 0

出世Sunn...

啊啊，对，类前面要加点，我给忽略了，下意识按视频里的<i></i>那样做了，谢谢，粗心真是不行

2015-10-23 09:32:39

共 1 条回复 >

echo_kinchao

2015-10-22 13:42:41

是否是因为您引用错误了

0 0
nideyida

2015-10-22 12:57:48

是按钮的边框吧！白色那条线？

0 0

CSS Sprite雪碧图应用

必学的大型网站实用技术，让你快速掌握CSS Sprite雪碧图技术

47101 学习 · 228 问题

查看课程

相似问题

为什么第二个雪碧图效果出不来呢？

回答 2

刷不出雪碧图啊

回答 2

雪碧图效率问题

回答 3

雪碧图不显示

回答 3

关于雪碧图

回答 1

打开慕课网App查看更多内容