A5.ru: конструктор сайтовA5.ru: создать собственный сайт без лишних затрат и усилий! |
Статья для сайта Итак, продолжаем работу над созданием «Простого сайта».В
прошлый раз, в 5 уроке, мы с вами добавили на страницу сайта таблицу для
контента. В этом уроке мы заполним таблицу контентом. Как я уже упоминал, в качестве контента, мы добавим на страницу сайта статью с названием: «Мой первый сайт в Интернет». Изначально, статья для сайта, была мною написана в текстовом редакторе Word. Для того, чтобы форматирование Word не передавалось в визуальный HTML редактор, я перенес статью в редактор Блокнот. Добавляем название статьи на страницу сайта Сначала откройте страницу
сайта в визуальном редакторе. Далее, кликните левой кнопкой мыши в таблицу
для контента, чтобы выбрать ее для редактирования.
Следующим шагом, откройте статью в блокноте. Сначала, давайте добавим на веб страницу название статьи. Выделите название статьи в блокноте и далее, кликните
на название статьи правой кнопкой мыши. В контекстном меню окна выбираем
копировать. Теперь переходим к визуальному редактору. В визуальном редакторе, кликаем правой кнопкой в таблицу для контента и в новом окне выбираем «Вставить». Размер и цвет шрифта названия статьи Ну что же, мы добавили название статьи на страницу
сайта. Теперь нам нужно выбрать размер шрифта для названия статьи. Когда мы с
Вами создавали шапку сайта, то размер шрифта названия сайта, нами был задан
размером заголовка первого уровня – h1. Для названия статьи, выберем размер шрифта, равный размеру заголовка второго уровня – h2. Что касается цвета заголовка статьи, то я его сделаю таким же, как и название сайта. Чтобы задать цвет текста в визуальном редакторе, я выделяю его, нахожу в панели инструментов кнопку «Выбор цвета для теста», выходит окно выбора цвета. Выбираем нужный цвет, и кликаем «ОК». Добавляем статью на сайт Нам осталось добавить статью на страницу сайта.
Открываем блокнот со статьей, выделяем всю статью и копируем в блокноте. Вновь
переходим к нашей странице открытой в визуальном редакторе. Кликаем правой кнопкой в таблицу для контента и в контекстном меню выбираем «Вставить». Статья будет добавлена на страницу. В процессе добавления статьи, в визуальный редактор, в
тексте могут появиться разрывы, отступы и другие недочеты, поэтому следующим
шагом, отредактируйте добавленную статью. Внимательно просмотрите и отредактируйте статью так, чтобы она была правильно разбита на абзацы, красиво смотрелась и легко читалась. После редактирования статьи, жмем в визуальном
редакторе кнопку сохранить и для проверки изменений, открываем страницу
браузером. Мы видим, что статья на страницу добавлена. Но текст статьи прижался вплотную к левой рамке таблицы. Меняем отступ статьи от рамки таблицы Чтобы увеличить отступ текста от рамки таблицы, воспользуемся
свойствами таблицы для контента. Выберем в панели инструментов визуального
редактора NVU,
инструмент «Таблица». Далее, в окне свойств таблицы, выбираем одноименную
вкладку – «Таблица». Здесь нас интересует параметр: «Поля внутри ячейки». Когда
мы создавали таблицу для контента, этому параметру мы задали значение «0». Чтобы увеличить поля внутри ячейки таблицы, и этим самым увеличить отступ от рамки таблицы до текста, присвоим параметру «Поля внутри ячейки» значение «12». Сохраним изменения в редакторе, нажав кнопку
«Сохранить». Обновляем нашу страницу в браузере и смотрим что получилось. Теперь добавленная статья имеет нужный нам отступ и
соответственно текст статьи смотрится вполне нормально и читабельно. Теперь мы можем добавить картинку на страницу сайта, как это сделать, мы рассмотрим в следующем уроке. Перейти к Уроку 7: Как добавить картинку на сайт Перейти к Уроку 5: HTML таблица - для контента Автор: Виктор Милованов |