HTML-страница шаблона - PullRequest
0 голосов
/ 12 июля 2010

Привет, я новичок в веб-программировании.Я хочу создать шаблон типа css, где все страницы выглядят одинаково, за исключением содержимого страниц.

Итак, у меня есть логотип и несколько вкладок вверху, где вы можете перемещаться по сайту, но содержимоестраниц будет отличаться (contact, about, info.etc).

Как мне создать этот шаблон?

Ответы [ 4 ]

3 голосов
/ 12 июля 2010

Возможно, вы захотите попробовать построить страницу шаблона в простом HTML + CSS, а затем использовать простые PHP-включения для создания ваших страниц.Например, вы можете разбить вашу страницу на два отдельных файла:

header.php:

<!DOCTYPE html>
<html>
    <head><title>Hello World</title></head>
    <body>
        <div id="main-content">

и footer.php:

        </div>
    </body>
</html>

И затем,для любых файлов, которые используют этот шаблон, вы должны использовать что-то вроде этого:

<?php include("header.php"); ?>

<!--All the content of your page goes here-->
<h1>Hello World!</h1>
<p>Lorem Ipsum</p>

<?php include("footer.php"); ?>

Итак, если кто-то посетит предыдущий файл (скажем, он называется index.php), то файлы будут собраны иокончательный вывод HTML будет выглядеть примерно так:

<!DOCTYPE html>
<html>
    <head><title>Hello World</title></head>
    <body>
        <div id="main-content">

        <!--All the content of your page goes here-->
        <h1>Hello World!</h1>
        <p>Lorem Ipsum</p>

        </div>
    </body>
</html>

Просто убедитесь, что на вашем сервере запущен PHP, иначе это не сработает вообще.Кроме того, если вы хотите разработать свой сайт локально, я бы рекомендовал использовать XAMPP для получения локального хоста Apache.

1 голос
/ 12 июля 2010

Предлагаю начать с бумажного эскиза. Просто нарисуйте прямоугольники для различных областей, которые будут на каждой странице ... таких как логотип, верхний колонтитул, контент, нижний колонтитул и т. Д. Есть много способов приблизиться к этому начальному этапу. Вот одно из объяснений метода серого ящика .

Как только у вас появится примерная идея, создайте 1 образец страницы. Вы можете заполнить контент с помощью lorum ipsum . Получите CSS так, как вам нравится, и убедитесь, что каждый раздел страницы (примерно каждый блок в вашем наброске) находится в своем собственном уникальном div (id = "...").

Как только вы все это настроите, ваш файл CSS будет готов к работе.

Чтобы создать HTML-файл шаблона, просто возьмите HTML-страницу, над которой вы работали, и удалите все ipsum lorum.

CSS Zen Garden - отличное место для поиска идей CSS.

1 голос
/ 12 июля 2010

Вы просматриваете некоторые из множества шаблонных сайтов - например, http://www.freecsstemplates.org/ или http://www.freecsstemplates.com/. Скорее всего, вы найдете что-то близкое к тому, чего хотите достичь.

0 голосов
/ 12 июля 2010

Если вы новичок, я мог бы предложить попробовать Adobe Dreamweaver и посмотреть на использование шаблонов DreamWeaver (.dwt). Он действительно очень прост в использовании и позволяет создать 1 мастер-файл (шаблон) с редактируемыми частями.

Если у вас Visual Studio, MasterPages выполняет аналогичную работу!

Удачи и добро пожаловать в мир веб-разработки!

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...