CSS는 아래에 표시되는 텍스트가

98.214.131.200/index.phpCSS는 아래에 표시되는 텍스트가

<html> 
<head> 
    <title>Peoria Triathlon Club</title> 
    <meta charset=iso-8859-1" /> 
    <link href="style.css" rel="stylesheet" type="text/css" /> 
</head> 
<body> 
<ul id="nav"> 
    <li><a href="http://tri-peoria.org">Home</a></li> 
    <li><a href="/forum">Forum</a></li> 
    <li><a href="/join">Join</a></li> 
    <li><a href="/members">Members</a></li> 
    <li><a href="/events">Events</a></li> 
    <li><a href="/training">Training</a></li> 
    <li><a href="https://www.facebook.com/groups/tripeoria/">Facebook</a></li> 
    <ab><a href="/about">Peoria Triathlon Club</a></ab> 
</ul> 
<ul id=main> 
<p>Main</p> 
</ul> 
</body> 
</html>

98.214.131.200/style.css

body { 
    background:#000 url(bg.jpg) center top no-repeat; 
    background-size: cover; 
    color: #c1c1c1; 
    font-family: Arial, Verdana, Helvetica, sans-serif; 
    margin:0; 
} 

#nav { 
width: 100%; 
float: left; 
margin: 0 0 3em 0; 
padding: 0; 
list-style: none; 
background-color: #f2f2f2; 
border-bottom: 1px solid #ccc; 
border-top: 1px solid #ccc; 
} 

#main{ 
    display:inline-block; 
    float:left; 
}

이 어떻게 주요 사업부에서 일을해야합니까 사진 아래에 나타납니다 만들려면 배경 그림과 상단에 탐색 모음이 있습니까? 현재 코드는 http : // 98.214.131.200에서 볼 수 있습니다.

출처

2012-09-18 Tyler Siegrist

z 축 또는 아래에서 y 축 (수직)을 따라 아래에 있음을 의미합니까? –

y 축의 의미는 –

타일러뿐 아니라 스타일뿐 아니라 마크 업도 제공하십시오. – amn

변경에게 "주"컨테이너를 시도 귀하의 주 div 내부).
#main css에 margin-top 속성을 추가하면 적절한 금액을 탐색 모음에서 낮추게됩니다.
```
<div id="main"> 
<p>Main</p> 
</div> 
```
그리고있는 style.css에서
가 :
```
#main { 
    margin-top: 240px; /* Adjust as needed */ 
} 
```
당신은 메인 CSS에서 display: inline-block를 덤프 할 수 있고, 당신이 float:left을 필요로하지 않을 수의 index.php에 따라서

당신의 후속 의도에 따라.

은 또한 신체의 CSS에서 background-size: cover를 삭제해야하거나 이미지가 당신에게뿐만 아니라 주요 사업부를 커버로 성장할 수 있습니다.

출처

2012-09-18 14:03:12

나는 당신이 달성하고자하는 것을 정확히 볼 수는 없지만 몸의 높이와 동일한 "패딩 - 탑"을 추가 할 수 있습니다 배경 이미지.

body {패딩 - 톱 : 50px; } // bg.jpg가 50px 높이라고 가정하면

#main에 실제로 float가 필요한지 확인하십시오.

출처

2012-09-18 13:22:22 rafaelbiten

본문에 패딩을 추가하면 탐색 모음도 아래로 이동합니다. 98.214.131.200/index.php로 가면 현재 디자인을 볼 수 있습니다. 지금 저는 "수영", "자전거 달리기"그림 아래의 "주요"텍스트를 이동하려고합니다. –

당신이 그것을 ul을 만들 수있는 충분한 이유가 있지 않는 ... 당신은 항상 ul을 가질 수있다 (대신 ul의 div이

body { 
background-color: #000000; 
    background-image: url("bg.jpg"); 
background-position: center top; 
    background-repeat: no-repeat; 
color: #C1C1C1; 
    font-family: Arial,Verdana,Helvetica,sans-serif; 
    margin: 0; 
} 

#main { 
    margin-top: 370px; 
}

출처

2012-09-18 14:02:56 webCoder

CSS는 아래에 표시되는 텍스트가

답변

관련 문제