Практика по написанию HTML тегов
Основы HTML, практика по написанию HTML кодов для начинающих. Простые скрипты для начинающих. Помощь в работе с текстом HTML для начинающих. Первые шаги по написанию HTML кода.Самым главным в написании HTML страницы является правильное написание кодов ссылок.
3 самых основных видассылок
Определение ссылки WikipediaВнимание:
чтобы вы увидели код я буду заменять знаки < > на круглые скобки ( ).Чтобы предложенный мною код работал у вас надо будет вам поменять скобки с () на <>.Перечислим несколько самых основных типов ссылок и рассмотрим самые часто используемые атрибуты ссылок
Ссылки бывают нескольких типов:
- Cсылка на почтовые клиент.
- Под эти предложением понимается то что иногда на странице вы можете увидеть предложение написать создателю страницы сайта по почте. При нажатии на эту ссылку у вас откроется страница с входа в вашу почту или запустится почтовый агент(mail.ru agent или другой). При этом ссылка которую вы написали сможет автоматически вставить в поле "тема сообщения" вставить написанную вами тему.
- Например вы видете такую надпись: Чтобы написать автору: нажми здесь,то HTML код выглядит так: Чтобы написать автору(a href="mailto:kkirra@mail.ru?subject=обсуждение_сайта_в_теме") нажми здесь(/a).После каждого слова в атрибуте subject ставится нижнее подчёркивание.
- Ссылки на JavaScript. Определение JavaScript
- Чтобы просмотреть как работает самый простой JavaScript нажми ссылку: проверить, а код скрипта выглядит так:(a href="javascript:window.alert('Это сработал простой JavaScript')-эти круглые менять на < не надо")проверить(/a)
- Относительная ссылка - ссылка ссылающаяся на страницу находящуюся в том же каталоге, что и сама статья.Я делать сейчас эту ссылку рабочей не буду , а вы можете потренироваться.
Например: ссылка на которм находится эта статья имеет вид:(a href="page.html")скачать(/a)
а ссылка с дополнением материала имеет вид(a href="page1.html") скачать(/a) - Cсылка ссылающаяся на верхнюю часть cтраницы с использованием метки id="top" топ- верх в начало страницы Добавляем тег id="top" к тегу body в верху страницы . Ссылка выглядит следующем образом(a href="#top")в начало страницы(/a)
- Если вы хотите что то подчеркнуть , то это можно сделать с помощью следующего тега:(hr width="550px" color="#cc0000" align="left")
- width задаёт длинну подчёркивания
- color задаёт цвет линии
Раздел в котором опишу основные атрибуты ссылок
Атрибуты Ссылок
- атрибут ссылок terget - атрибут который указывает в каком окне открывать ссылку
- в том же окне Ссылка выглядит так:(a href="http://driver1.my1.ru/" target="_self") ,
- в новом окне Ссылка выглядит так:(a href="http://driver1.my1.ru/" target="_blank")
- тругой атрибут title ,ссылка т.е при наведении курсора мыши на ссылку увидите название страницы на которую ведёт ссылка
- атрибут link - задает цвет ссылок пока их ещё не нажали.
- vlink цвет ссылки после нажатия.
- alink - отвечает за цвет ссылки при наведении на неё курсора.
Атрибуты тега body
- (font face="verdana" size="2" color="#000000) тег - определяющий шрифт, размер и цвет
Другой не менее важный тег 'то тег div - тег парный.
- Если после открывающего тега body создать тег div и в атрибуте указать тег align="center" , закрыть тег div перед закрывающим тегом (/body) то весь ваш текст будет выровнен по центру страницы.
- Пример:
(body link="#3562c5" vlink="#c53535" alink="#000000") (font face="verdana" size="2") - шрифт, размер и цвет (div align="left") (font color="#FFFFFF")создаём таблицу
- тег table создает таблицу - тег парный
- тег tr создает строку тег тоже парный
- тег td создает столбец и он парный
- атрубут тега td тег colspan="2" означает что мы хотим объеденить 2 столбца одной строки( в последней строке из второго столбца удаляем слово итого и переносим его в первый столбец и полностью удаляепм второй столбец. В первом столбце получится (td colspan="2")
- атрибутом тега td также является тег rowspan - который задает параметр объединения нескольких строк в одном столбце (td rowspan="3")
- можно также соеденить 2 строки и 2 столбца , для этого создаём ещё 2 строки
- (tr)
(td>3(/td) тройку удаляем
(td>работа(/td) здесь пишем избавится
(td> 7 часа (/td)здесь пишем можно (/tr) -
(tr)
(td)3(/td) удаляем -3
td>работа(/td - удаляем строку полностью
td> 7 часа (/td - нельзя
(/tr)
и вторую строку
- (tr)
(td>3(/td) тройку удаляем
атрибуты тега table
- тег border="1" показывает рамку, если =0 то рамки не видно
- тег align="center" или left или reit
- width тег содающий ширину таблицы
- bgcolor тег который определяет внутренний фон таблицы
- cellspacing тег с помощью которого создаётся между каждой ячейкой определённое растояние обычно =0
- cellpadding указывает браузеру сколько пикселей отступать внутри рамки
- bordercolor тег который указывает какого цвета рамка
- для каждой строки или ячейки можно применить теже все эти атрибуты(т.е. (td align="center" )
- также можно в каждую ячейку вставить ещё таблицу
место наименование бесполезной траты времени часы 1 телевизор 2 часа 2 интернет 6 часа 3 работа 7 часа итого 15 часов избавится можно нельзя