Приветствуем!
Первый раз с этого устройства? Рекомендуем зарегистрироваться или войти чтобы открыть для себя более большой спектр возможностей!
Обновите, чтобы удалить сообщение

Тэги и аргументы
31.08.2016 10:59, HTML


Приветствую тех, кто уже читал статью о "основных понятиях"
Сейчас разберем теги: их значение и практичность использования

1. Теги или элементы
Как вы уже знаете, теги могут быть одинарными и блочными, блочные имеют "закрывающий тег" со слэшем, а аргументы пишутся после их названия
Короче говоря, если вам нужно вывести на странице заголовок, вы используете <h%размер%>, если изображение - тег <img> и т.д.
Обычно если вы не выводите обязательные аргументы тега то они остаются со значением по умолчанию
Я часто пользуюсь этим HTML справочником (такие сайты называют мануалами) потому что запомнить в уме все элементы - невозможно
Вообщем с тегами все просто, в нужном месте в коде вы пишите <%название%> (если элемент блочный - то добавляете ещё и <%/название%>) и на странице отображается необходимая информация

2. Как теперь понимать атрибуты или аргументы?
Это проще, чем вы могли подумать, чтобы вам было понятнее лучше сразу привести пример
1. Задача: нужно вывести на странице текст с кеглем (размером) 24, 48 и 64

<!DOCTYPE HTML>
<html>
<head>
<title>Атрибуты в HTML</title>
</head>
<body>
<p> <!-- абзац -->
<font size="4">Я маленький текст</font> <!-- для форматирования используем "<font>" и размер шрифта - 4 -->
<br> <!-- перенос строки -->
<font size="5">Я умеренный текст</font> <!-- 5 -->
<br>
<font size="6">Я большой текст</font> <!-- 6 -->
</p>
</body>
</html>
Как вы видите, для того, чтобы дать тексту определённый размер, в теге "<font>" используется атрибут "size" и в кавычках числом указывается кегль
2. Задача: отрисовать изображение размером 64 на 64 пикселя
<!DOCTYPE HTML>
<html>
<head>
<title>Атрибуты width и height</title>
</head>
<body>
<img src="https://img-fotki.yandex.ru/get/4612/137106206.5f6/0_16f9b6_b61a78f7_orig" width="64" height="64"> <!-- вывод изображения, используется одинарный тег -->
<!-- атрибут "src" указывает путь к изображению, путь может быть как и глобальным, так и относительным (например "Mishki.ru/img/Mishka.jpg" или просто "/img/Mishka.jpg", относительный путь сработает только при условии что изображение и страница находятся на одном сайте) -->
<!-- "width" - длина изображения, "height" - высота -->
</body>
</html>
В теге можно указывать сразу несколько атрибутов, но только если они связаны с этим элементом
Если вы внимательно смотрели код, то могли заметить, что здесь длина и ширина указывается без "px" (т.е. без слова "пикселей"), запомните это!
3. Задача: составить таблицу размеров 4x3 ячеек и объединить верхнюю строку
<!DOCTYPE HTML>
<html>
<head>
<title>Оплата веб-программистов</title>
</head>
<body>
<table border="1"> <!-- тег создающий таблицу -->
<tr><td colspan="4">Заработок веб-программистов</td></tr> <!-- "<tr>" добавляет строку в таблице, "<td>" - ячейку, атрибут "colspan" объединяет x ячеек по горизонтали (для объединения по вертикали используйте "rowspan")-->
<tr><td>HTML</td><td>CSS</td><td>PHP</td><td>Java</td></tr> <!-- 2 строка -->
<tr><td>100 р./час</td><td>200 р./час</td><td>500 р./час</td><td>400 р./час</td></tr> <!-- 3 строка -->
</table>
</body>
</html>
После примеров можно выделить, что чтобы указать атрибут нужно использовать следующий макет: <тег атрибут="значение"></тег>
Видите? В атрибутах ничего сложного нет, думаю это доказано примером, далее читайте о более сложных понятиях в HTML'е
Спасибо за внимание!

Даниил Константинов (Россия, 953, Администратор)


Комментарии:

К этой статье комментариев не найдено
Опередите всех, напишите первым(ой)!


Чтобы оставить комментарий вам нужно зарегистрироваться или войти

Кажется ваш браузер - не Google Chrome или Internet Explorer 11.
Последствием этого может быть некорректное отображение страниц сайта.
Не показывать

Ссылки на страницы сайта:

(последнее обновление страницы - 23:26:56 Мск)

Sitetopbox
Sorogin OC
Sorogin engine

Sorogin Labs
Бизнес с компанией
Вебмастерам

Виртуальная комната
Журнал
Основной сайт

Рабочий стол
Терминал
Техподдержка


Здесь вы можете разместить свою рекламу от 4 рублей обратившись по адресу sorogincompany@gmail.com
Besucherzahler
счетчик посещений