HTML의 여러 하위 페이지에 통합 헤더를 추가하는 방법은 무엇입니까?
<p>내비게이션 바 시스템을 개발 중인데 하위 페이지를 변경하는 방법을 알고 싶습니다. 하지만 원본 페이지의 제목은 그대로 유지됩니다. (저는 repl.it을 사용하고 있으니 주의하세요). </p>
<p>아직 폴더에 아무것도 넣지 않았습니다.
또한 "활성" 클래스(회색 항목)가 있는 항목 위로 마우스를 가져가도 색상이 변경되지 않기를 원합니다. </p>
<p>
<pre class="brush:css;toolbar:false;">@import url('https://fonts.googleapis.com/css2?family=Roboto+Mono:wght@700&display=swap');
HTML 본문{
배경: #0E1212;
}
울 {
목록 스타일 유형: 없음;
여백: 0;
패딩: 0;
오버플로: 숨김;
배경색: 없음;
글꼴 계열: 'Roboto Mono', 고정 폭;
}
리 {
왼쪽으로 뜨다;
}
리 아 {
디스플레이: 블록;
색상: #DBDBDB;
텍스트 정렬: 중앙;
패딩: 14px 16px;
텍스트 장식: 없음;
}
리 a:hover {
색상: #682AE9;
애니메이션 이름: 예;
애니메이션 지속 시간: 0.5초;
애니메이션 반복 횟수: 1;
애니메이션 채우기 모드: 앞으로;
}
.활동적인 {
색상: #808080;
}
@keyframes 예시 {
0% {색상: #DBDBDB;}
100% {색상: #622cd8;)
}</pre>
<pre class="brush:html;toolbar:false;"><!DOCTYPE html>
<html lang="ko">
<머리>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="stylesheet" href="home.css">
<script src='script.js'>
<title>홈</title>
</머리>
<본문>
</머리>
<본문>
<ul id='메뉴'>
<li><a class="active" href="#home" id="home">.home()</a></li>
<li><a class="inactive" href="#news">.about()</a></li>
<li><a class="inactive" href="#contact">.stuff()</a></li>
<li><a class="inactive" href="#about">.apply()</a></li>
</ul>
</body>
</html></pre>
</p>
