CSS

Темизация Drupal урок 5 Темизация поля. Шаблон field.tpl.php.

В этом уроке мы продолжаем темизировать друпал и на этот раз темизируем поля. После этого урока мы будет темизировать вывод Views.

Для темизации поля, нужно скопировать файл modules/field/theme/field.tpl.php в папку templates вашей темы и дать ему новое имя согласно одному из шаблонов:

Темизация Drupal урок 3 Верстаем Блог, Новости, Контакты часть 2

В этом уроке мы приведем в порядок наш блог, новости, контактную форму. Допишем немного CSS кода и используем CSS3 генератор кода.

 

Темизация Drupal урок 3 Верстаем Блог, Новости, Контакты

В этом уроке мы сделаем на сайте страницу Новостей, выведем Блог и контактную форму. Для блога мы используем стандартный модуль blog, только добавим картинку к каждой записи в блоге. А в новостях помимо одной картинки, у нас будет небольшая фотогалерея. На странице контактов мы вставим Яндекс-карту и контактную форму.

Мы будем заниматься выводом этих страниц, а их темизацией мы займемся в следующем уроке.

Темизация Drupal урок 2 часть 3 Заканчиваем верстку главной страницы

В этом уроке мы:

  • закончим верстку главной страницы,
  • создадим шаблон для главной страницы,
  • назначим главную страницу,
  • добавим и темизируем дополнительные блоки.

 

Темизация Drupal урок 2 Верстаем главную страницу

admin друпал drupal

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

 

Учебник CSS - Урок Заключение - От HTML/CSS к Друпалу

На этом заканчивается учебник по CSS, но не заканчивается изучение CSS. Я предлагаю перейти к практике и дальше изучать CSS на основе создания темы друпала. Я найду в Интернете psd макет и мы сверстаем его в тему друпала на основе темы Zen.

 

Учебник CSS - Урок 5 - Свойства float, clear. Обтекание и конец обтекания.

Представьте себе бурную горную реку, текущую очень быстро и шумно. И вот на пути этой реки встает камень и река обтекает этот камень. Если камень слева по отношению к направлению течения реки, то река обтекает камень справа, если камень справа - то река обтекает его слева. Так же работает свойство css float.

CSS float

Чтобы продемонстрирвать работу свойств float и clear, я нарисовал следующий рисунок:

Учебник CSS - Урок 4 - Свойство display. Отличие div от span.

В прошлых уроках мы подключили css через файл и написали немного css-кода чтобы посмотреть как это все работает. В этом уроке мы разберемся с одним важным свойством display. Свойство display отвечает за то как отображается тег в HTML документе, будет он  располагаться как текст в линию или это блок который имеет свой высоту и ширину. Итак, начнем с самого простого, как по умолчанию отображаются теги, а отображаются они по разному: <div> отображается как блок, <span> как текст в линию. Давайте начнем с того как отображается текст.

Учебник CSS - Урок 3 - Свойства background-color, font-style, font-weight, text-align, text-decoration, text-transform.

За время существования HTML придумали много тегов и теперь с повсеместным применением css от некоторых придется отказаться, среди таких тегов <font>, <b>, <i>, <center>. Позже мы рассмотрим другие "запрещенные" теги. Также эти свойства помогут вам избежать лишнего кода в HTML-коде страницы и вынести его в css-файлы.

Учебник CSS - Урок 2 - Начинаем использовать CSS. CSS-свойства background, color.

CSS-свойства background, color

Привет, Всем. Итак, в прошлом уроке я сделал два файла html и css. Вот их код:

index.html:

<html>
 <head>
  <title>Учебник CSS</title>
  <link type="text/css" rel="stylesheet" media="all" href="style.css" />
 </head>
 <body>
  <p>Учите CSS вместе с drupalbook.ru</p>
  <p>2 строка учите CSS вместе с drupalbook.ru</p>
 </body>
</html>

style.css:

Страницы

Подписка на RSS - CSS