заработать в интернет
Урок 3: Работаем с текстом
В предыдущем уроке мы создали свою первую простейшую страничку. В этом уроке мы подробнее остановимся на свойствах текста, научимся выделять абзацы, заголовки и.т.д. Если вы возьмете и скопируете текст данного урока от начала и до первой картинки, и вставите его в свою первую страничку, то вы увидите примерно следующее: пример неотформатированного текста Как вы заметили текст идет слитно, без разделений на абзацы, также ничего не выделено заголовком, короче форматирование отсутствует! Т.е. чтобы Браузер правильно отображал текст, необходимо задать его форматирование. Основными элементами форматирования текста в html являются: - P Используется для разбивания текста на параграфы - H1,H2,...H6 Применяются для создания заголовков 1,2...6 уровней - BR Используетcя для переноса строки - DIV , SPAN Используются для выделения части документа определенным способом. P - используется для разметки параграфов в html документах. Атрибуты: ALIGN - определяет способ горизонтального выравнивания параграфа . Возможные значения: left, center, right, justify. Это соответственно по левому краю, по центру, по правому краю, и по ширине .По умолчанию имеет значение left. Приведу пример: Если внутри тела документа написать следующее:Этот параграф по центру
Этот по левому краю
Этот тоже по левому (т.к. по умолчанию)
Этот по правому краю
В этом параграфе текст будет выравниваться по ширине (одновременно по левому и правому краям документа). Не понимающие justify браузеры будут выравнивать текст по левому краю
То при просмотре в браузере получим следующее: форматирование абзацев Примечание: следите чтобы содержимое в кавычках было написано без пробелов, т.е.а не
иначе не будет работать! ↑ Наверх ↑ H1,H2,...H6 - Применяются для разбивания текста на смысловые уровни - разделы и подразделы. Существует шесть уровней заголовков, различающихся по величине шрифта. Атрибуты: ALIGN - определяет способ горизонтального выравнивания заголовков. Возможные значения: left, center, right .По умолчанию - left. Приведу пример: Если внутри тела документа написать следующее:
Большой заголовок
Заголовок поменьше
Еще меньше
Совсем маленький
Малюсенький заголовочек
Ну просто лилипутский заголовочек
То при просмотре в браузере увидим: выделение заголовков в html Примечание: закрывающий тег обязателен! ↑ Наверх ↑ BR - данный элемент осуществляет перенос строки. Не имеет закрывающего тега. Приведу пример: Если внутри тела документа написать следующее: Начинается первая строкатеперь идет вторая
а вот уже и третья
А это параграф и внутри него тоже можно использовать тег
переноса строки.Его надо использовать всегда, когда надо перенести строку:)
Как вы наверное заметили, при переносе строки не начинается новый параграф! Перенос- он и есть перенос! ↑ Наверх ↑ DIV - В современном сайтостроении используется как удобный контейнер для блоков html кода страницы, которым легко динамически манипулировать – перемещать, регулировать отступы, скрывать и т.п. Обязателен закрывающий тег! Атрибуты: ALIGN - определяет способ горизонтального выравнивания контейнера. Возможные значения: left, center, right, justify. Это соответственно по левому краю, по центру, по правому краю, и по ширине .По умолчанию имеет значение left. Допустим нам нужно выровнять первые две строчки текста из предыдущего примера по правому краю, не выделяя при этом их в абзац. Как это сделать?
теперь идет вторая
А это параграф и внутри него тоже можно использовать тег
переноса строки.Его надо использовать всегда, когда надо перенести строку:)
тогда Вы без проблем разберетесь с этой замечательной программой! Что мы увидим: тег SPAN Как видите, как будто мы ничего и не выделяли! Но если прописать какой нибудь стиль этому тегу, то он начнет работать! Хотите пользоваться Adobe Dreamweaver - тогда изучите хотя бы основы html и
тогда Вы без проблем разберетесь с этой замечательной программой! В данном случае я прописал стиль красного цвета, подробнее о стилях в курсе CSS. тег SPAN с атрибутами стиля Таким образом с помощью элемента SPAN можно хоть каждой букве в тексте присвоить разный стиль(цвет, размер, и.т.д.) ↑ Наверх ↑ См. также Следующий - Урок 4: Продолжаем работать с текстом Предыдущий - Урок 2: Создаем свою первую страничку [Обсудить на форуме] Есть вопрос? Получи ответ на ФОРУМЕ ПОДДЕРЖКИ