Question

为什么我的填充不起作用我的logo div它在我添加一个额外的div之前工作但是我仍然无法看到它不起作用的原因。请查看我的代码以确定你是否可以帮助我：）

<!DOCTYPE html>
<html>
<head>
    <title>Learning Javacript</title>
    <link href="main.css" rel="stylesheet" type="text/css">

    <link href="normalize.css" rel="stylesheet" type="text/css">
</head>
<body>
    <header>
        <div class="contact_info">
        <div class="email">
        <img src="icons/icon_mail.png">
        <p>contact@thislooksgreat.net</p>
        </div>
        <div class="phone">
        <img src="icons/icon_phone.png">
        <p>+40.727.123.456</p>
        </div>
        <div class="Social_Media">
            <ul>
            <li><img src="Social/facebook.png"></li>
            <li><img src="Social/twitter.png"></li>
            <li><img src="Social/youtube.png"></li>
            <li><img src="Social/googleplus.png"></li>
            <li><img src="Social/linked.png"></li>
            </ul>
        </div>
        <div class="language">
        <p>ENGLISH</p>
        <img src="icons/arrow.png">
        </div>
        </div>
    </header>
    <div class="main_real">
    <div class="main_img">
    <div class="main_nav_width">
    <div class="main_nav">
        <div class="logo">
            <img src="Logo/logo.png">
        </div>
        <nav>
            <ul>
                <li><a href="#">Home</a></li>
                <li><a href="#">About Us</a></li>
                <li><a href="#">News</a></li>
                <li><a href="#">Portfolio</a></li>
                <li><a href="#">Blog</a></li>
                <li><a href="#">Shop</a></li>
                <li><a href="#">Contact</a></li>
            </ul>
        </nav>

    </div>
    </div>
    </div>
    </div>


</body>
</html>
html,body,h1,h2,h3,h4,h5,h6,p,li,ul,a,nav{
    padding:0px;
    margin:0px;

}

header{
    width:100%;
    background-color:#143e6e;
    height:40px;
    border-top:6px solid #0d2f57;

}
.contact_info{
    width:1200px;
    margin:0 auto;


    }
.contact_info p, img{

    float:left;

}
.email p,img{
    float:left;
}
.email .phone, p{
    padding-top:12px;
    padding-right:60px;
    font-family:Arial, Helvetica, sans-serif;
    font-size:13px;
    color:white;

}
.email img{
    padding-top:11px;
    padding-right:10px;
}
.phone p,img{
    float:left;
}
.phone img{
    padding-top:7px;
}

.Social_Media ul{
    padding-top:10px;
    padding-left:25px;
    float:right;

}
.Social_Media li{
    display:inline;

}
.Social_Media img{
    padding-right:25px;

}
.Social_Media  li:last-child img {
     padding-right:0px
}
.language{

    float:right;

}
.language p{
    padding-right:0px;

}
.language img{
    padding-top:15px;
    padding-left:5px;
}
.main_nav_width{
    width:100%;
    background-color:white;
    box-shadow: 0 5px 6px -6px black;

}

.main_nav{
    width:1200px;
    margin:0 auto;
    height:90px;



}

}

.logo{
    clear:both;
    float:left;
    padding-top:15px;
}
nav ul{
    float:right;
    padding-top:35px;
    height:55px;


}
nav li{
    display:inline;
}
nav li:last-child a{
    margin-right:0px;
}

nav a{
    width:50px;
    margin-right:20px;
    margin-left:20px;
    padding-top:33px;
    padding-bottom:40px;
    text-decoration:none;
    height:90px;
    color:#143e6e;
}
nav a:hover {
    width:90px;
    padding-top:35px;
    text-decoration:none;
    height:15px;
    color:#143e6e;
    border-bottom:5px solid blue;
    padding-bottom:33px;
}
nav li:last-child a:hover{
    width:70px;
    margin-left:20px
}

.main_img{
    background-image: url("images/imac.png");
    background-repeat:no-repeat;
    background-position: 780px 64px;
    background-repeat: no-repeat;
    background-size:500px 500px;
    width:100%;
    height:650px;
}
.main_real{
    background-image: url("images/background_jumbo.jpg");
    background-repeat:no-repeat;
    background-position: right top;
    background-size:100% 480px;
    width:100%;
}

Answer 1

检查括号。额外的大括号可能会让你失望。如果没有尝试获得JSFiddle。

[]string

为什么我的标识从我的徽标中删除？

1 个答案: