Первые шаги в коддинге. Или с чего начать изучение HTML

/ Учебник по Html. Ступенька 8-ая.

Учебник по Html для чайников. Простейшие.

Ступенька 8-ая.

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

Сначала рассмотрим курсив и полужирный текст:

Полужирный текст
Наклонный текст (курсив)

Как видите, все просто. Можете их сами понатыкать в тексте, где хочется, для пробы, а в примере я снова помучаю виртуального друга:

Здравствуйте, это моя первая страница. Добро пожаловать! :) Я совсем недавно начал(а) знакомиться с виртуальной жизнью, но мне по давней традиции тоже захотелось создать свою домашнюю страничку для моих новых виртуальных друзей и знакомых, чтобы они могли посмотреть мои фотографии, почитать обо мне, черкнуть пару строчек в мою гостевую книгу. А может и просто случайный посетитель вдруг захочет познакомится со мной, и у меня появится еще один виртуальный друг? :) ()

Теперь пара строк о моширинном шрифте. Что это такое за шрифт? Это шрифт с символами одинаковой фиксированной ширины, как шрифт у пишущей машинки. А тэг для него следующий:

моноширинный шрифт

В наш пример я его вводить не буду (сделайте это самостоятельно).

Также моноширинным шрифтом отображается текст заключенный в тэг

:

 
текст (куча пробелов) текст 
 текст (куча пробелов) текст
 текст (куча пробелов) текст

У тэга

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

 
текст


 
В нашем примере текст моноширинный, полужирный, и выделен курсивом (вот
так-то:). Не бойтесь использовать различные комбинации тэгов,
экспериментируйте, но с умом:) 
Итак, у нас еще осталось несколько тэгов, которые мы должны освоить на
этой ступеньке, прежде чем двинуться дальше.
Подчеркнутый текст вводится при помощи тэга :

  Подчеркнутый текст

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

  Перечеркнутый
 

 Перечеркнутый  
Тэг  представляется крупным шрифтом, а
 малым шрифтом относительно основного текста: 

  Малый


Нормальный текст

 Большой  
Тэги Sup и Sub - определяют верхний и нижний индексы. Sup - верхний,
Sub - нижний. Где они могут пригодиться? Ну, например, при написании
какой-нибудь формулы - H 2 O (все, что мы выносим
со школьной скамьи:). 
Верхний индекс  sup


Нижний индекс  sub
 
Вот, собственно, и все. Можем переходить на следующую ступеньку.

Учебник по HTML для чайников
. Автор - Алленова Наталья

 
 От автора:


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



 
Простейшие.


4 - "Раскрась сам. Изменяем цвет текста".

5 - "Как изменять цвет фона страницы. Немного об этике цветов".

6 - "Параграфы и DIV. Учимся выравнивать текст".

7 - "Что такое заголовки и как задавать размер буковок".

8 - "Курсив, жирный текст, подчеркнутый и другие".

9 - "Стандартные шрифты. Как прописать свой шрифт".

10 - "Что такое путь? Как вставлять картинки".

11 - "Что можно сделать с картинкой. Картинка, как фон документа, и т.д.".

12 - "О любителе сосисок и принудительном прерывании обтекания текстом картинки".

13 - "Ссылка и как с нею бороться".

14 - "Ссылка на е-майл. Подсказка к текстовой ссылке".

15 - "Может ли картинка быть ссылкой".

16 - "Куда податься, на что ссылаться. Новое окно при нажатии на ссылку".

17 - "Карты. Как часть картинки сделать ссылкой".

18 - "Карты. Как часть картинки сделать ссылкой 2".

19 - "Карты. Как часть картинки сделать ссылкой 3". 

20 - "Закладка. Как сделать ссылку внутри документа".
Таблицы.


21 - "Учимся создавать таблицы".

22 - "Учимся создавать таблицы" продолжение.

23 - "Таблицы, вертикальное выравнивание (valign)".

24 - "Таблицы, учимся растягивать ячейки (rowspan, colspan)".

24-2 - "Дополнительная глава. Ответы на домашнее задание".

25 - "Таблицы, что такое cellspacing и cellpadding. Что делать с пространством".

26 - "Вложенные таблицы и некоторые нюансы".

27 - "О рамках таблиц, и брюзжание о таблицах напоследок".

28 - "Создаем простой сайт с таблицами". 
Дополнительные.


29 - "Спецсимволы, или головная боль".

30 - "О линиях. Просто и полезно".

31 - "Как убрать отступы (поля) документа, topmargin, leftmargin, marginwidth, marginheight".

32 - "О списках. Неупорядоченные списки".

33 - "Упорядоченные списки. Ремарка: что такое спецификация и консорциум".

34 - "Cпецифические тэги, бегущая строка текста". 
Фреймы.


35 - "Вступление. Зачем они (фреймы) нужны."

36 - "Учимся создавать фреймы".

37 - "Учимся создавать фреймы" продолжение.

38 - "Учимся создавать фреймы" продолжение.

39 - "Убираем полосу прокрутки, избавляемся от рамок, регулируем ширину полей фрейма".

40 - "При нажатии на ссылку документ открывается в другом фрейме, в полное окно".

41 - "Последняя глава о фреймах. Что такое IFrame".

Первые страницы учебника:
Учебник по Html для чайников. Инструментарий.
Ступенька 1-ая.

Порядок прежде всего, поэтому перед началом работы мы создадим на нашем компьютере отдельную папку для будущей страницы.
D:\первые шаги\ 
У себя на компьютере я создала такую папку на диске D, и назвала ее
Первые Шаги. Вы, естественно, можете создать вашу папку, где угодно, и
назвать ее, как угодно.
Теперь откроем блокнот – notepad (start – programs – accessories –
notepad или пуск – программы – стандартные – блокнот) и скопируем туда
следующий текст:

 









Здравствуйте, это моя первая страница.
 

Добро пожаловать! :)



 ()



Сохраним этот документ, присвоив ему имя *.html
D:\первые шаги\index.html 
Многие читатели спотыкаются на фразе: "А теперь сохраним этот документ, присвоив ему имя *.html
",
 они пишут письма, о том, что у них получается сохранить, только как
текстовой документ *.txt, а вот как *.html - никак. Чтобы в дальнейшем
избежать этого глупого недоразумения, я и пишу это примечание.
Ступенька 8-ая.

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

 Полужирный текст
 

 Наклонный текст (курсив)
 
Как видите, все просто. Можете их сами понатыкать в тексте, где хочется,
 для пробы, а в примере я снова помучаю виртуального друга:







 











Здравствуйте, это моя первая страница.



 Добро пожаловать!
 :)



Я совсем недавно начал(а) знакомиться с виртуальной жизнью, но мне по
давней традиции тоже захотелось создать свою домашнюю страничку для
моих новых виртуальных друзей и знакомых, чтобы они могли посмотреть мои
 фотографии, почитать обо мне, черкнуть пару строчек в мою гостевую
книгу. А может и просто случайный посетитель вдруг захочет познакомится
со мной, и у меня появится
 еще один виртуальный друг? :)




 

 ()


Теперь пара строк о моширинном шрифте. Что это такое за шрифт? Это шрифт
 с символами одинаковой фиксированной ширины, как шрифт у пишущей
машинки. А тэг для него следующий:

  моноширинный шрифт 
В наш пример я его вводить не буду (сделайте это самостоятельно). 
Также моноширинным шрифтом отображается текст заключенный в тэг 
:
 
Текст (куча пробелов) текст
 текст (куча пробелов) текст
 текст (куча пробелов) текст

У тэга 
Есть одна замечательная особенность: текст,
заключенный в него, выводится с точностью до пробела так, как вы его
набили в блокноте. Этот тэг вам может быть полезен, допустим, для
форматирования стихотворений.
К одному фрагменту текста может применяться сразу несколько тэгов:

  текст


В нашем примере текст моноширинный, полужирный, и выделен курсивом (вот
так-то:). Не бойтесь использовать различные комбинации тэгов,
экспериментируйте, но с умом:)
Итак, у нас еще осталось несколько тэгов, которые мы должны освоить на этой ступеньке, прежде чем двинуться дальше.
Подчеркнутый текст вводится при помощи тэга :

  Подчеркнутый текст
  
Тэги  и  представляют текст перечеркнутым
шрифтом, можете использовать какой вам угодно из них, принципиальной
разницы между ними нет:

  Перечеркнутый  

 Перечеркнутый  
Тэг  представляется крупным шрифтом, а  малым шрифтом относительно основного текста: 

  Малый 

Нормальный текст

 Большой  
Тэги Sup и Sub - определяют верхний и нижний индексы. Sup - верхний, Sub
 - нижний. Где они могут пригодиться? Ну, например, при написании
какой-нибудь формулы - H 2 O (все, что мы выносим со школьной скамьи:). 
Верхний индекс  sup 

Нижний индекс  sub  

Сегодня рассмотрим,
 как основной способ добавления графики на HTML-страницу - соответственно, непосредственно с помощью тега «img»
, так и другие дополнительные способы
, которые могут понадобиться в различных ситуациях при разработке интернет-страниц.
Разберём всевозможные настройки и особенности,
 которые можно применить к графике: указание размера (ширина, высота), выравнивания, отступы, различные эффекты при наведении мышью на картинку и прочее...
 
Заработок на написании статей, комментариев на форумах
Сервис позволяет зарабатывать копирайтерам - платят за написание статей для сайтов, создание новых тем на форумах, написание к ним комментариев. Также можно зарабатывать на рерайте, копипасте и переводах текста. Отличный раскрученный сервис, множество работ...
 
Хостинг для «Drupal 8»
Разрабатывая новый сайт, как обычно выбрал «Drupal» (на момент написания статьи, наиболее новой стабильной версией является 8-я)
.
Если в общем, то считаю данный «движок» лучшим. Но, как вы знаете, документации на русском языке не так много, как хотелось бы, а в виду широких возможностей Друпал, её недостаток порой может создавать сложности веб-мастерам, недавно начавшим работать с данной системой, да и не только начинающим... Я, например, работаю с данной CMS уже более 8 лет, но при решении сложных задач иногда возникают трудности, так как не владею английским на должном уровне. Хотя, когда проблему удаётся решить, в очередной раз убеждаешься в том, насколько хорош и удобен «Drupal» в плане своих возможностей.
 
Выезжающая панель на «Mootools»
Данный урок мы посвятим созданию всплывающих панелей для сайта.
Нам потребуется
 малейшее представление о «Mootools» и, конечно же, знание CSS-стилей, необходимых для создания её дизайна.
Прежде чем начать, скачайте файл-архив с исходниками . Там же вы найдете пример получившейся панели (index.html).
Приступим к реализации...
 
Как заработать много денег в интернете - с помощью чего это можно сделать
 
Основы внутренней оптимизации сайтов под поисковые системы
Процесс оптимизации сайтов под поисковые системы разделяют на 2 этапа:
Внутренняя оптимизациия
 - оптимизация внутренних факторов сайта (код, структура сайта, контент)
. Необходимо изначально делать свой сайт привлекательным для поисковых систем, чтобы не увеличивать себе объёмы работ по мере дальнейшего продвижения.
 
Внешняя оптимизация
 - улучшение позиций сайта за счёт внешних факторов (покупка ссылок, обмен и прочее)
.
Сегодня хотелось бы отдельно поговорить о внутренней оптимизации
 и выделить основные моменты.

 
Как сделать скриншот экрана в Windows 7, 8, 10 или XP
Скриншот
 (ScreenShot)
 экрана - это функция, позволяющая быстро скопировать все, что отображается в данный момент на вашем мониторе. Фактически - это мгновенная фотография вашего монитора, автоматически сохраняемая (в основном в формате.png).
Быстрая съемка экрана может потребоваться в различных ситуациях. Например, при возникновении появлений сообщений об ошибке , что может существенно помочь мастеру, который будет выполнять ремонт, если вам необходимо составить инструкцию для пояснения работы в какой-либо программе или на определенном сайте, или же вы достигли определённых результатов в компьютерной игре и хотели бы сохранить их отображение на память.
 
Как сделать восстановление системы Windows 7, 8, 10 или XP
Самостоятельная установка программного обеспечения на ПК связанна с определенным риском, который может выражаться в повреждении правильности работы всей системы или же удалении некоторых полезных функций и настроек, которые были удобны для пользователя.
Именно поэтому, очень важно предусмотреть возможность быстрого возврата к исходному состоянию
 без потери важных настроек и файлов.
С этой целью в ОС «Windows» предусмотрена специальная функция для восстановления системы, которая позволяет создавать контрольные точки состояния Виндовс. Последние дают возможность восстановить программное обеспечение ПК до предыдущего состояния.
Ступенька 1-ая.

Порядок прежде всего, поэтому перед началом работы мы создадим на нашем компьютере отдельную папку для будущей страницы.
D:\первые шаги\ 
У себя на компьютере я создала такую папку на диске D, и назвала ее Первые Шаги. Вы, естественно, можете создать вашу папку, где угодно, и назвать ее, как угодно.
Теперь откроем блокнот – notepad (start – programs – accessories – notepad или пуск – программы – стандартные – блокнот) и скопируем туда следующий текст:


 









Здравствуйте, это моя первая страница.
 

Добро пожаловать! :)



 ()



Сохраним этот документ, присвоив ему имя *.html
D:\первые шаги\index.html 
Многие читатели спотыкаются на фразе: "А теперь сохраним этот документ, присвоив ему имя *.html
", они пишут письма, о том, что у них получается сохранить, только как текстовой документ *.txt, а вот как *.html - никак. Чтобы в дальнейшем избежать этого глупого недоразумения, я и пишу это примечание.
Если вы сохраняете документ, через Файл -> Сохранить (File -> Save), то, естественно, что он сохраняется как *.txt. Надо сохранять ваш документ следующим образом:
Файл -> Сохранить Как (File -> Save as)

- Дальше вводите имя своего документа, например: index.html (а не просто index; приписочка *.html должна быть обязательно).

- Если вы уже сохранили ваш документ, как *.html, то при внесении изменений в этот документ вы можете уже сохранять их через Файл -> Сохранить (File -> Save). 
Вот и все. Надеюсь, теперь у всех все будет в порядке.
Теперь откроем броузер, допустим, Internet Explorer (не закрывайте блокнот, он нам еще пригодится), и откроем в броузере наш документ.
Файл - Открыть - кнопка Обзор - Наш документ (index.html) 

File – Open – Browse – index.html
Если мы чего-то изменим в нашем *.html документе (в блокноте), то, чтобы посмотреть, как это выглядит в нашем броузере, надо не забывать нажимать в броузере кнопку ОБНОВИТЬ. Если изменений не видно, то это значит, что вы где-то что-то неправильно написали, или забыли сохранить документ.