2014-03-06 4 views
0

나는 회사의 웹 사이트를 다시 디자인하고 버튼 링크가있는 가로 방향 탐색 막대를 만들려고 노력하고 있습니다. 문제는 정확히 같은 메뉴가 모든 페이지 (100 개 이상 있음)에 표시되고 버튼 옵션이 앞으로 감소 할 수 있다는 것입니다.CSS의 일부로 버튼 텍스트와 링크를 포함하는 방법

제 질문은 : 버튼 텍스트와 관련 링크를 외부 CSS에 삽입하여 모든 페이지를 다시 코딩하고 나중에 편집하는 방법이 있습니까? 나는 내가 생각할 수있는 모든 것을 수색하고 시도했다. 아래의 코드는 아직 많은 작업이 진행되고 있으므로 조언을 제공해 주시면 감사하겠습니다.

관련 CSS :

/* BEGIN Menu Buttons*/ 

#menu {text-align:center;} 

#menu ul { 
    display: inline-block; 
    list-style-type: none; 
    text-align: center;} 

#menu ul li { 
    float: left; 
    width: 140px; 
    height:50px; 
    list-style-type:none;} 

#menu li a { 
    width: 130px; 
    height:40px; 
    padding:5px; 
    display:block; 
    color: #fff ; 
    background-color: #000 ; 
    font: Times New Roman; 
    font-size:14pt; 
    line-height:40px; 
    text-align:center; 
    text-decoration: none ; 
    border-right:1px solid #fff; 
    border-left:1px solid #fff; 
    border-top: 1px solid #fff; 
    border-bottom: 1px solid #fff;;} 

#menu li a:hover { 
    border-top: 3px solid #000; 
    border-bottom: 3px solid #000; 
    outline: 1px solid #fff; 
    font-size:16pt;} 

/* END Menu Buttons*/ 

관련 HTML :

<header> 
<div id="menu"> 
     <ul> 
     <li><a href="index.html">Home</a></li> 
     <li><a href="buy.html">Buy</a></li> 
     <li><a href="sell.html">Sell</a></li> 
     <li><a href="maintenance.html">Maintenance</a></li> 
     <li><a href="parts.html">Parts</a></li> 
     <li><a href="information.html">Information</a></li> 
     <li><a href="contact.html">Contact</a></li> 
     </ul> 
    </div> 
</header> 
+1

어떤 유형의 프레임 워크를 사용하고 있습니까? .Net, PHP, Ruby 등 ... – snowYetis

+0

내가 알고있는 것은 아니지만 의도적으로는 아닙니다. Dreamweaver CS4, 메모장 및 Apache OpenOffice를 사용하여 모든 것을 직접 작성하고 있습니다. – SalesAssistant

+0

php는 사용하기 위해 설정해야 할 서버 측 언어입니다. 사용하는 경우 "알지 못하는"경우 가장 대답이 "아니오"보다 큽니다. 널리 사용 가능하지만 가장 좋은 해결책은 호스트 회사가 이미 서버에 설치되어있을 수도 있다는 것입니다 ... 서버에서 "hello world".php 파일을 시험해보고 볼 수 있는지 확인하십시오. 할 수 있으면, 당신은 모두 준비되어 있고 .php를 배우기 시작합니다. – Phlume

답변

0

내가 제대로 질문을 이해한다면, 내가 사용하는 것이 해결책이 PHP

당신이 저장해야 모든

우선 귀하의 페이지를 .php로 바꾸어 (.html이 아닌)

두 번째로 ew 파일 (menu.php)을 열고 위의 MENU 코드를 붙여 넣으십시오. 당신은, 당신이 가진 메뉴 HTML 코드를 대체 모든 페이지에서

:

<?php 

include 'menu.php'; 

?> 

(당신은 페이지의 다른 부분과 같은 폴더에 menu.php를 넣어 가정) 이제 메뉴 내용이 확장되면 menu.php 만 편집하면 menu.php 파일이 포함 된 모든 페이지에서 메뉴가 업데이트됩니다.

+0

btw. PHP, HTML 및 CSS를 허용하는 코딩 놀이터가 있습니까? (올인원) – DeKnarf

+0

그 제안을 시도했지만 메뉴가 전혀 나타나지 않습니다. 나는 전에 PHP로 일한 적이 없지만 누락 된 태그가 있습니까?사용중인 헤더 이미지와 배경색이 올바르게 표시됩니다. – SalesAssistant

+0

서버 envoirement에서 파일을 테스트했는지 확인하십시오. "오프라인"으로 테스트하는 경우 메뉴가 표시되지 않습니다. index.html의 이름을 index.php로 변경 했습니까? menu.php를 index.php와 같은 폴더에 넣으십시오. – DeKnarf

0

또 다른 해결책 PHP를 사용하지 않고 html 솔루션이 필요한 경우 항상 iframe에 의지 할 수 있습니다.

<iframe id="iframe" src="xxx.html" width="500" height="180"></iframe> 

만이 가진 문제는 당신이 모든 페이지에 width를 업데이트해야 woudl입니다, 당신의 메뉴에 대한 더 큰이 iframe을보다 (더 넓은) 계정이 될 것이다.

관련 문제