4.4. Файл header.php

Глава 4.0. Шаблон HTML и динамические страницы

Введение

Файл header.php

Создадим в блокноте файл header.php и вынесем из файла sample.html код от начала страницы (<!doctype html>) и до окончания блока </nav>, исключив блок стилей, заключенный в теги <style> и </style>.
Так же изменим путь к файлу стилей с

<link rel="stylesheet" href="style.css" />

на

<link rel="stylesheet" href="css/style.css" />

, который создадим на следующей странице руководства

header.php

<!doctype html>
<html lang="en" xml:lang="en" xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta charset="utf-8">
    <!-- запрет автоперевода перевода google translate -->
    <meta name="google" content="notranslate">
	<!-- отображение файктической ширины экрана для адаптивного дизайна -->
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>sample.html</title>
    <link
      href="https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300|Sonsie+One"
      rel="stylesheet"
      type="text/css" />
    <!-- блок стилей вынесе во внешний файл /css/style.css -->
    <link rel="stylesheet" href="css/style.css" />
    <!-- следующие 3 строки нужны для корректного отображения семантических элементов HTML5 в старых версиях Internet Explorer-->
    <!--[if lt IE 9]>
      <script src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv.js"></script>
    <![endif]-->
  </head>
  <body>
    <!-- Вот наш главный заголовок, который используется на всех страницах нашего веб-сайта -->
    <header>
      <h1>Logo</h1>
    </header>
<nav class="navbar">
		<ul>
			<ul>
				<li><a class="active" href="#home">Home</a></li>
				<li><a href="#/about">About</a></li>
				<li><a href="#/contact">Contact</a></li>
			</ul>
		</ul>
		      <!-- Форма поиска. -->
    <form class="search-form">
	<ul>
        <li><input type="search" placeholder="Search..."></li>
		<li><button class = "search-form-button" type="submit" value="Go!">Go!</button></li>
 
		</ul>
    </form>
</nav>

Файл уже не такой громоздкий, и разобраться в нем намного проще. Вынисем из него стили в отдельный файл style.css и директорию CSS, о чем речь пойдет на следующей странице руководства

Дополнения и Файлы

см. также:

4.3. Файл sample.html 4.4.1. Файл style.css

Помогите улучшить Страницу

Была ли эта страница полезна для вас?-10+1
Сообщить о проблеме с этим контентом:polskiyvn@gmail.com

software/development/demo/cms/ucms/sample_php_page_header.txt · Последнее изменение: 2026/02/08 16:34 — VladPolskiy

Только авторизованные участники могут оставлять комментарии.

Содержание