Question

该网站上的导航不允许我单击或选择。我不确定为什么。页面均正确链接。当我检查页面时，我可以单击功能链接。导航位于标题和About部分两部分之间。每个部分都有几个元素。大多数情况下，我必须使用绝对位置才能将元素移动到我希望它们移动的位置。

#header {
	font-family: "Eras Demi ITC", sans-serif;
	color: white;
	background: rgba(174, 4, 33 );
	width: 100%;
	height: 20%;
	display:inline-block;
}
#header2 {
	font-family: "Eras Demi ITC", sans-serif;
	color: white;
	width: 100%;
	height: 20%;
	display:inline-block;
}
#mainHeader h1{
	text-align: left;
	display:inline-block;
}
#mainHeader img{
	width:100%;
}
    
body {
	margin:0;
	padding:0;
	background-color:black;
	background-repeat: no-repeat;
	background-position: center;
}
.path img{
	display:inline-block;
	position:absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, 200px);
}
#nav a:link{
	width:50%:
	height:2%;
	text-align:center;
	padding:1%;
	background-color:white;
	display:block;
	height:30px;
	padding:0;
}
#aboutMe img{
	text-align:center;
	width:100%;
	height:500px;
	object-fit: cover;
}
#path {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, 870px);
}
.div1 {
	display:inline-block;
	width: 20px;
	height: 30px;
	text-align: center;
	border: 2px solid white;
	text-align:center;
	box-sizing: border-box;
	color:white;
	position:absolute;
	left:33.5%;
	bottom:-55px;
}
#aboutMe p {
	display:inline-block;
	text-align:center;
	background-color:rgba(174, 4, 33, .6);
	padding:4px;
	width:40%;
	position:absolute;
	left:55%;
	bottom:-30%;
}
#aboutMe h2 {
	color:white;
	display:inline-block;
	position:absolute;
	left:30%;
    }
#aboutMe {
	margin:none;
}

<div class="path">
	<img src="images/path.png"/>
</div><!--path-->	
<div id="header">
	<div id="mainHeader">
		<img src="images/banner1.jpg" alt="Black Background"/>
		<h1>words</h1>
	</div><!--mainHeadereader-->
</div><!--header-->  

<div id="nav">
	<a href="#aboutMe">About Me</a>
	<a href="index.html#work">Work</a>
	<a href="index.html#contact">Contact</a>
</div><!--nav-->

<div id="aboutMe">
	<div class="aboutImg">
	<img src="images/pic.jpg" alt="Black Background"/>
	<h2>About Me</h2>
    <div class="div1">1</div>
</div>

Answer 1

您在#nav a:link{中使用#nav a{来访问CSS。查看有关styling links

的更多详细信息

导航无法选择

1 个答案: