№ 021: Розбиття деталей, що вміщують - CSS-хитрощі

Anonim

Тепер, коли ми використовуємо власний локальний домен, ми можемо використовувати PHP. "P" у MAMP означає "PHP" =). Використання PHP означає, що ми можемо використовувати включення. Наприклад:

Наша мета - зробити статичну сторінку “допису в блозі”, з якою можна почати возитися. Ми могли б зробити це, дублюючи нашу сторінку index.html (тепер index.php), але у нас у цьому файлі було б багато повторюваного коду. Пам’ятайте, ми намагаємось залишатися якомога СУШІШИМИ (Не повторюйтесь).

Ми робимо папку під назвою “деталі”, в яку вклеюємо маленькі шматочки багаторазового використання, загальні для всіх сторінок. Подібно до розміщення DOCTYPE та head заголовків у частині, навігації та нижньому колонтитулі (на даний момент лише деякі закриваючі теги).

Тепер на нашій сторінці index.php та на нашому blogpost.php використовуються декілька включень та різняться лише там, де це насправді важливо: вміст.

Ми трохи розширюємо можливості нашої сітки, роблячи налаштування 2/3 1/3, яке ми будемо використовувати частіше на сторінках, схожих на статті.

Ми не включаємо тег body, якщо нам потрібно змінити класи на ньому, щоб використовувати його для стилізації сторінки по-іншому, якщо це стане корисним для стилювання на основі ієрархічно високого класу.

Ми створили blogpost.php із реальним HTML із справжнього повідомлення в блозі. Тому що, як ніколи, краще розробляти реальний вміст, а не фальшивий. Для цього потрібно буде багато попрацювати, але у нас є чудова основа для роботи.