Question

我想将nav标签分成四个相等的部分（如正方形），并为它们添加四个不同的背景图像。这是我的代码：

<nav>
    <ul>
        <li><a href="#">Home</a></li>
        <li><a href="#">About Us</a></li>
        <li><a href="#">Feedback</a></li>
        <li><a href="#">Contact</a></li>
    </ul>
</nav>

Answer 1

<style>
ul
{
list-style-type:none;
margin:0;
padding:0;
overflow:hidden;
}
li
{
float:left;

}
a
{
display:block;
width:60px;



}
.img1{
background-image:url();
background-repeat:no-repeat;
}

.img2{
background-image:url();
background-repeat:no-repeat;
}

.img3{
background-image:url();
background-repeat:no-repeat;
}

.img4{
background-image:url();
background-repeat:no-repeat;
}


</style>
</head>

<body>
<ul>
<li><a href="#home" class="img1" >Home</a></li>
<li><a href="#news" class="img2">News</a></li>
<li><a href="#contact" class="img3">Contact</a></li>
<li><a href="#about" class="img4>About</a></li>
</ul>

将导航标签分成四个相等的部分

1 个答案: