|
HTML | Работа с текстом. | Урок #2.2
|
|
| karabawka |
Дата: Четверг, 01.11.2012, 22:33 | Сообщение # 1
|
Главный предприниматель
Сообщений: 1121
Статус: Offline
|
Работа с текстом в HTML. 2 часть урока!
Стиль текста.
Здесь все достаточно просто..
Итак, новые теги: <b> </b> - Полужирный текст.
<i> </i> - Наклонный текст
<u> </u> - Подчеркнутый текст
<strike> </strike> - Перечеркнутый
<s> </s> - Перечеркнутый (второй вариант, от первого ничем не отличается)
<tt> </tt> - моноширинный шрифт
<small> </small> - Малый
<big> </big> - Большой
<sup> </sup> - Верхний индекс
<sub> </sub> - Нижний индекс
Ну думаю понятно.. текст заключённый между этими открывающими и закрывающими тегами приобретёт нужный нам стиль.
Вот пример на всякий случай…
Code <html>
<head>
<title>Стили текста</title>
</head>
<body>
<big><b><u>Научная статья.</u></b></big>
<br>
<br>
Если разбавить дистиллированную воду Н<sub>2</sub>О сорока процентами этилового спирта С<sub>2</sub>Н<sub>5</sub>ОН то получится жидкость в 40<sup>о</sup> более известную широкой публике под названием <i>- водка.</i>
<br>
Впервые данную пропорцию <s>придлажил</s> предложил <tt>Дмитрий Иванович МЕНДЕЛЕЕВ.</tt>
<br>
<br>
<br>
<small>Распитие спиртных напитков вредит вашему здоровью.</small>
</body>
</html>
Шрифты.
Для того чтобы изменить шрифт документа необходимо дать указание браузеру, что мол от сель до сель показывать текст таким шрифтом. Для этого используем всё тот же тег <font> и его атрибут face - лицо то бишь..
Пишется так:
Code <font face="arial">Эта строчка будет написана с помощью шрифта Arial</font>
Code <html>
<head>
<title>Использование различных шрифтов</title>
</head>
<body>
<font face="arial">Мало кто знает, как много надо знать для того, что бы знать, как мало мы знаем.</font>
<br>
<font face="times new roman">Мало кто знает, как много надо знать для того, что бы знать, как мало мы знаем.</font>
<br>
<font face="comic sans ms">Мало кто знает, как много надо знать для того, что бы знать, как мало мы знаем.</font>
<br>
</body>
</html>
Здесь необходимо отметить, что браузер использует библиотеку шрифтов, установленную на компьютере пользователя, и если вдруг указанного Вами шрифта в этой библиотеке не окажется, то он заменит его на тот который присутствует. Следовательно, чтобы не ударить face(ом) в грязь, не стоит указывать какие-то "экзотические" нестандартные шрифты, так как супер модный шрифт на компьютере Вашего друга сильно рискует превратиться в обыкновенный.
Предварительно отформатированный текст.
Если Вы обратили внимание, а если не обратили то знайте, что в браузерах текст набранный с помощью текстовых редакторов проходит "обработку" перед выводом его на экран компьютера. Так в набранном Вами тексте удаляются все переносы строк и лишние пробелы, пробелов между словами или просто символами может быть не более одного.
Проводится данная "обработка", для того чтобы на мониторах с разным расширением экрана текст переносился на следующую строку в тех местах где это действительно необходимо, а не там где были раннее расставлены пробелы и переносы строк.
Однако такая политика браузеров, в ряде случаев, не всегда оправданна.. Как например, написать стихи? Нет можно конечно после каждой строчки писать тег <br>, но есть вариант куда проще..
Знакомимся тег <pre>, текст заключённый в данный тег выводится браузерами на экран в том виде в котором он был набран, т.е. со всеми пробелами и переносами строк!
Пример:
Code <html> <head> <title>Пробелы и перенос строки</title> </head> <body> <pre> СЛОН. Дали туфельки слону. Взял он туфельку одну И сказал: - Нужны пошире, И не две, а все четыре! С. Я. Маршак. </pre> </body> </html>
В принципе - это основные вещи, которые вам не обходимо знать при работе с текстом. Вы уже смело можете создавать простейшие странички, с описанием например чего-нибудь. Особо нового в уроке, я думаю вы не получили, так как вы наверно заметили некую схожесть с bb кодами форума или с функциями текстового редактора Word. Спасибо за то что уделили время уроку, надеюсь вам было все понятно!
Полезные советы:
Писать странички в блокноте конечно можно, но я Вам настоятельно рекомендую воспользоваться полноценным HTML редактором, благо их на рынке программного обеспечения великое множество. Я не буду давать их подробное описание, скажу лишь что они, как правило, несут в себе одинаковые стандартные наборы инструментов и отличаются друг от друга пожалуй только интерфейсом.. сравнивать их не берусь, так как они носят исключительно характер привычки пользования веб мастером тем или иным редактором html кода.
Расскажу про основные плюсы использования подобного редактора.
Как правило, html редакторы имеют два окна, в одном Вы пишите код, а во втором сразу видите результат написанного! То есть теперь Вам не придётся постоянно сохранять текущий результат, чтобы открыть его браузером и оценить написанное.
Как правило, они содержат в себе стандартные наборы шаблонов кода, в который Вы просто подставляете свою информацию, избавляя себя от прописывания тегов.
Ну и "общие" удобства - сохранить, открыть, редактировать сразу несколько страниц сайта перелистывая их… много короче разных полезных штук.. одна подсветка синтаксиса чего стоит!
Немного об этике и здоровье глаз..
Если создаваемый Вами сайт его дизайн и назначение не требуют обратного, то советую избегать следующих вещей: Использовать яркие контрастные цвета фона и шрифта. Поверьте, когда у человека начинают слезиться глаза от чтения такой страницы, он резко теряет к ней интерес. Это же касается и размеров текста. Не стоит использовать огромные заголовки, впрочем, как и содержание малюсенькими буквами - это напрягает, ищите золотую середину..
Спасибо, за то что уделили внимание на прочтение урока! Удачного изучения! 
|
|
|
|
|
| Aleksandro_Galante |
Дата: Суббота, 13.04.2013, 14:07 | Сообщение # 2
|
Новичок
Сообщений: 21
Статус: Offline
|
Хороший урок
|
|
|
|
|
| Dubscron |
Дата: Четверг, 06.06.2013, 10:09 | Сообщение # 3
|
Боец
Сообщений: 67
Статус: Offline
|
автор кто?
[url=http://cheat-master.ru/forum/103-22245-1][b][Обмен] в системах Webmoney, Yandex. QIWI[/b][/url]
|
|
|
|
|
| karabawka |
Дата: Понедельник, 10.06.2013, 22:47 | Сообщение # 4
|
Главный предприниматель
Сообщений: 1121
Статус: Offline
|
Dubscron, все что я тут писал по большей части спизженно с http://webremeslo.ru/ . Я лишь самые информативные уроки для новичков сюда засунул и оформил для приятного чтения. Уроки там не самые современные,хочу сказать, однако для языка разметки тут информация достаточно важная, т.к. любой разработчик должен знать простейшие вещи.
|
|
|
|
|
| Dubscron |
Дата: Вторник, 11.06.2013, 19:03 | Сообщение # 5
|
Боец
Сообщений: 67
Статус: Offline
|
Больше внимания уделяют блокам, нежели тексту, но все равно, урок стоящий.
[url=http://cheat-master.ru/forum/103-22245-1][b][Обмен] в системах Webmoney, Yandex. QIWI[/b][/url]
|
|
|
|
|
| karabawka |
Дата: Среда, 12.06.2013, 13:44 | Сообщение # 6
|
Главный предприниматель
Сообщений: 1121
Статус: Offline
|
Цитата (Dubscron) Больше внимания уделяют блокам, нежели тексту, но все равно, урок стоящий.
Да...Жалко нет нормально раздела по WEB. Так смысл то для языка разметки целый раздел держать, текст- просто динамическая инфа, а на этом сайте, откуда брал, там блять древняя инфа ( всякая табличная верстка и т.п.)
|
|
|
|
|
| Dubscron |
Дата: Среда, 12.06.2013, 20:28 | Сообщение # 7
|
Боец
Сообщений: 67
Статус: Offline
|
Цитата (karabawka) Да...Жалко нет нормально раздела по WEB. Так смысл то для языка разметки целый раздел держать, текст- просто динамическая инфа, а на этом сайте, откуда брал, там блять древняя инфа ( всякая табличная верстка и т.п.)
Ну тут основная тематика читерства, поэтому толкового раздела нету.
P.S. табличная верстка устарела давно, блоки forever.
[url=http://cheat-master.ru/forum/103-22245-1][b][Обмен] в системах Webmoney, Yandex. QIWI[/b][/url]
|
|
|
|
|
| karabawka |
Дата: Среда, 12.06.2013, 20:48 | Сообщение # 8
|
Главный предприниматель
Сообщений: 1121
Статус: Offline
|
Цитата (Dubscron) Ну тут основная тематика читерства, поэтому толкового раздела нету.
P.S. табличная верстка устарела давно, блоки forever.
Ну тк, а я о чём и говорю.  Нужен хотя бы раздел по верстке, я уж там не говорю чтоб по JS и прочему)
|
|
|
|
|
| Dubscron |
Дата: Четверг, 13.06.2013, 14:12 | Сообщение # 9
|
Боец
Сообщений: 67
Статус: Offline
|
можем вдвоем заполнить уроками раздел. Если что в лс пиши.
[url=http://cheat-master.ru/forum/103-22245-1][b][Обмен] в системах Webmoney, Yandex. QIWI[/b][/url]
|
|
|
|
|
