Понедельник, 29.04.2024, 18:47
Приветствую Вас Гость | RSS

Драйверы

Меню сайта
Уроки html

Практика по написанию HTML тегов

Основы HTML, практика по написанию HTML кодов для начинающих. Простые скрипты для начинающих. Помощь в работе с текстом HTML для начинающих. Первые шаги по написанию HTML кода.

Самым главным в написании HTML страницы является правильное написание кодов ссылок.

3 самых основных видассылок

Определение ссылки Wikipedia

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

Перечислим несколько самых основных типов ссылок и рассмотрим самые часто используемые атрибуты ссылок

Ссылки бывают нескольких типов:

  1. Cсылка на почтовые клиент.

    • Под эти предложением понимается то что иногда на странице вы можете увидеть предложение написать создателю страницы сайта по почте. При нажатии на эту ссылку у вас откроется страница с входа в вашу почту или запустится почтовый агент(mail.ru agent или другой). При этом ссылка которую вы написали сможет автоматически вставить в поле "тема сообщения" вставить написанную вами тему.

    • Например вы видете такую надпись: Чтобы написать автору: нажми здесь,то HTML код выглядит так: Чтобы написать автору(a href="mailto:kkirra@mail.ru?subject=обсуждение_сайта_в_теме") нажми здесь(/a).После каждого слова в атрибуте subject ставится нижнее подчёркивание.

  2. Ссылки на JavaScript. Определение JavaScript

    • Чтобы просмотреть как работает самый простой JavaScript нажми ссылку: проверить, а код скрипта выглядит так:(a href="javascript:window.alert('Это сработал простой JavaScript')-эти круглые менять на < не надо")проверить(/a)

  3. Относительная ссылка - ссылка ссылающаяся на страницу находящуюся в том же каталоге, что и сама статья.Я делать сейчас эту ссылку рабочей не буду , а вы можете потренироваться.
    Например: ссылка на которм находится эта статья имеет вид:(a href="page.html")скачать(/a)
    а ссылка с дополнением материала имеет вид(a href="page1.html") скачать(/a)
  4. Cсылка ссылающаяся на верхнюю часть cтраницы с использованием метки id="top" топ- верх в начало страницы Добавляем тег id="top" к тегу body в верху страницы . Ссылка выглядит следующем образом(a href="#top")в начало страницы(/a)


  1. Если вы хотите что то подчеркнуть , то это можно сделать с помощью следующего тега:(hr width="550px" color="#cc0000" align="left")
    • width задаёт длинну подчёркивания
    • color задаёт цвет линии


Раздел в котором опишу основные атрибуты ссылок

Атрибуты Ссылок

  1. атрибут ссылок terget - атрибут который указывает в каком окне открывать ссылку
    • в том же окне Ссылка выглядит так:(a href="http://driver1.my1.ru/" target="_self")
    • ,
    • в новом окне Ссылка выглядит так:(a href="http://driver1.my1.ru/" target="_blank")

    • тругой атрибут title ,ссылка т.е при наведении курсора мыши на ссылку увидите название страницы на которую ведёт ссылка

    • атрибут link - задает цвет ссылок пока их ещё не нажали.
    • vlink цвет ссылки после нажатия.
    • alink - отвечает за цвет ссылки при наведении на неё курсора.

Атрибуты тега body

  1. (font face="verdana" size="2" color="#000000) тег - определяющий шрифт, размер и цвет

    Другой не менее важный тег 'то тег div - тег парный.


    1. Если после открывающего тега body создать тег div и в атрибуте указать тег align="center" , закрыть тег div перед закрывающим тегом (/body) то весь ваш текст будет выровнен по центру страницы.
    2. Пример:
      (body link="#3562c5" vlink="#c53535" alink="#000000") (font face="verdana" size="2") - шрифт, размер и цвет (div align="left") (font color="#FFFFFF")

      создаём таблицу

      1. тег table создает таблицу - тег парный
      2. тег tr создает строку тег тоже парный
      3. тег td создает столбец и он парный
      4. атрубут тега td тег colspan="2" означает что мы хотим объеденить 2 столбца одной строки( в последней строке из второго столбца удаляем слово итого и переносим его в первый столбец и полностью удаляепм второй столбец. В первом столбце получится (td colspan="2")
      5. атрибутом тега td также является тег rowspan - который задает параметр объединения нескольких строк в одном столбце (td rowspan="3")
      6. можно также соеденить 2 строки и 2 столбца , для этого создаём ещё 2 строки
        • (tr) (td>3(/td) тройку удаляем
          (td>работа(/td) здесь пишем избавится
          (td> 7 часа (/td)здесь пишем можно (/tr)

        • и вторую строку

        • (tr) (td)3(/td) удаляем -3
          td>работа(/td - удаляем строку полностью
          td> 7 часа (/td - нельзя
          (/tr)

      атрибуты тега table

      1. тег border="1" показывает рамку, если =0 то рамки не видно
      2. тег align="center" или left или reit
      3. width тег содающий ширину таблицы
      4. bgcolor тег который определяет внутренний фон таблицы
      5. cellspacing тег с помощью которого создаётся между каждой ячейкой определённое растояние обычно =0
      6. cellpadding указывает браузеру сколько пикселей отступать внутри рамки
      7. bordercolor тег который указывает какого цвета рамка
      8. для каждой строки или ячейки можно применить теже все эти атрибуты(т.е. (td align="center" )
      9. также можно в каждую ячейку вставить ещё таблицу
      место наименование бесполезной траты времени часы
      1 телевизор 2 часа
      2 интернет 6 часа
      3 работа 7 часа
      итого 15 часов
      избавится можно
      нельзя
Статистика

Онлайн всего: 1
Гостей: 1
Пользователей: 0
Поиск

Copyright MyCorp © 2024