Question

如何在导航栏中居中我的徽标？我已经把它集中在一起，但我遇到的问题是当我在内容区域放置图像时，图像会覆盖徽标的一部分。我确实希望徽标从导航链接中略微下降。我不想在徽标和内容图像之间留下巨大的空间。有没有办法实现这个目标？所附的图像是我试图完成的设计。提前致谢！

＆＃13;

body {  
    font-family:Georgia;
    font-size:12pt;
    }

    * {
	margin:0;
	 padding:0;
     }

    #header {
    background-color:#000000;
    height:100px;
    margin:auto;
    }

    #header ul {
    margin:0 auto;
    width:35%;
    padding:12px;
    list-style: none;
    }

    #header li {
    float: left;
    }

    #header a {
    padding:0 14px;
    text-align:center;
    display:block;  
	text-decoration:none;
	color:#FFFFFF;
	font-size:18pt;
	}    

    #header ul li a.logo {
    background: url("Logo.png");
    background-repeat:no-repeat;
    height:140px;
    display:block;
    width:140px;
    padding: 0;
 

    .clearfix {
    *zoom: 1;
    }

    .clearfix:after {
     content: "";
     clear: both;
     display: table;
     }

    #MainContent {
	}

    #MainContent img {
	margin-top:-10px;
	position:absolute;
	left:0;
	width:100%;
    }

    }

＆＃13;

<body>
	<div id="header" class="clearfix">
		
    	<ul class="Nav">      
			<li><a href="index.html">Home</a></li>
			<li><a href="menu.html">Menu</a></li>
			<li><a href="index.html" class="logo"></a></li>
			<li><a href="gallery.html" >Gallery</a></li>
			<li><a href="about.html">About</a></li>
				
            </ul>
               
            </div>
	<div id="MainContent">
	  <img src="Photos/drinks.jpeg">
	</div> 
</body>

＆＃13;

Answer 1

您可以在,Percentage = Format(cast(isnull(sum(Units) / nullif(sum(datediff(minute,StartTime,FinishTime))*1.0,0),0.0)*60 as decimal(10,0)) / 100 , 'p')课程中添加z-index。这将使其呈现在图像上方。

e.g。

.logo

https://developer.mozilla.org/de/docs/Web/CSS/z-index

如何在导航栏中居中显示我的徽标？

1 个答案: