我不明白为什么我不能将 margin-bottom 应用于 .linkaboutus。我正在尝试缩进 .linkportfolio。我刚刚学习,代码可能看起来很愚蠢并且有很多错误 - 我理解,如果有任何错误,请指出 - 谢谢。作为练习,我正在尝试从头开始布局页面。我目前正在创建初始菜单,但遇到了定位问题。左右移动有效,但上下移动则无效。我什至使用了display:block;,但它没有帮助。也许我错过了什么。我将不胜感激的帮助,或许还有 HTML:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>My Website</title>
<link rel="stylesheet" href="/Styles/css/style.css">
</head>
<body>
<div class="block1">
<div class="menu">
<div class="blockhome">
<div class="home">
<span class="texthome">
<a href="" class="linkhome">HOME</a>
</span>
<div class="blockportfolio">
<div class="portfolio">
<span class="textportfolio">
<a href="" class="linkportfolio">PORTFOLIO</a>
</span>
<div class="blockaboutus">
<div class="aboutus">
<span class="textaboutus">
<a href="" class="linkaboutus">ABOUT US</a>
</span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
社会保障体系:
@import "nullstyle";
body {
width: 1579px;
height: 5923px;
margin: 0 0 0 4px;
padding: 0 0 1178px;
background-color: #fff;
.block1 {
width: 1579px;
height: 688px;
margin: 0 0 108px;
padding: 29px 164px 111px 163px;
background-color: #f6f2f2;
}
.menu {
position: relative;
width: 1249px;
height: 89px;
margin: 0 2px 103px 1px;
padding: 0 432px 0 358px;
opacity: 0.8;
background-color: #000;
.blockhome {
width: 90px;
height: 89px;
margin: 0 40px 0 0;
padding: 44px 24px 33px 23px;
box-shadow: -0.3px -2px 35px 0 rgba(0, 1, 1, 0.3);
background-color: #ff3f40;
}
.linkhome {
width: 43px;
height: 12px;
font-family: OpenSans;
font-size: 14px;
font-weight: bold;
font-stretch: normal;
font-style: normal;
line-height: 1.71;
letter-spacing: 0.49px;
text-align: left;
color: #e0e0e0;
}
.blockportfolio {
}
.portfolio {
}
.textportfolio {
}
.linkportfolio {
position:relative;
display: block;
width: 83px;
height: 12px;
margin-top:-24px;
margin-bottom:34px;
margin-left: 104px;
font-family: OpenSans;
font-size: 14px;
font-weight: bold;
font-stretch: normal;
font-style: normal;
line-height: 1.71;
letter-spacing: 0.49px;
text-align: left;
color: #e0e0e0
}
.blockaboutus {
}
.aboutus {
}
.textaboutus {
}
.linkaboutus {
display: block;
width: 75px;
height: 12px;
margin-left: 241px;
margin-top:-24px;
font-family: OpenSans;
font-size: 14px;
font-weight: bold;
font-stretch: normal;
font-style: normal;
line-height: 1.71;
letter-spacing: 0.49px;
text-align: left;
color: #e0e0e0;
}
}
}
您需要添加position:relative:您显然删除了它,因为 你有一个时尚的空白空间。输出将是这样的