| 10 тегов HTML, которые редко используют новички | Категория: HTML и CSS
Каждый, кто читает данный урок, наверняка знает, что
такое HTML. Но обзор основ помогает увеличить знания и отточить
мастерство, особенно в условиях постоянно развивающихся веб технологий.
Сейчас много говорят об изменениях, которые принес
HTML 5. Каждый тег, упомянутый в данной статье поддерживается и в HTML
4.01 и в HTML 5. Хотя некоторые из этих тегов широко используются, будет
очень полезно пересмотреть задействованные методы.
1. <!- ->
Каждая книга о программировании содержит упоминание о
том, что очень полезно объяснять, что делает ваш код. Почему
комментирование является хорошей практикой? Это очень помогает тому, кто
читает ваш код, разобраться в сути происходящего.
Для HTML комментирование может казаться пунктом,
увеличивающим вес страницы. Однако комментарии могут быть полезны для
определения секций и для сохранения структуры и организации кода
страницы. Отметка начала и конца различных секций может реально помочь
при работе над проектом.
Чтобы сделать хороший дизайн таблиц, нужно
использовать теги, указанные в подзаголовке. Они все влияют на строки
таблицы и можно легко задать для них стили.
Item
Qty
Sum
7
#1
3
#2
4
<thead>
Оборачиваем строки таблицы в <thead></thead>. Таким образом формируется заголовок таблицы.
<tfoot>
Обернув строки в <tfoot></tfoot> формируем итоговые строки внизу таблицы. Строки <tfoot> должны определяться до строк <tbody>, таким образом, итоговые строки выводятся на экран до остальных строк таблицы.
Выпадающий список является великолепным способом
представить данные для выбора пользователя. Они не только занимают мало
места, но и знакомы пользователям и легки в применении. Чудесным
свойством <optgroup> является возможность создавать категории (или подзаголовки) для элементов списка.
Конечно, каждый использует заголовки. Но если быть честным, то когда вы в последний раз использовали <h3>
или заголовок еще более низкого уровня? Заголовки позволяют строить
меньше семантических конструкций, таких как дополнительные стили для
текста в <div>.
Не надо создавать себе дополнительной работы. Помните про теги заголовков.
5. <fieldset> и <legend>
Всем нравятся сайты, на которых легко найти нужную информацию среди логически сгруппированных элементов. <fieldset>
группирует вместе элементы формы , рисуя вокруг них прямоугольную
рамку. Также возможно добавить название к такой секции с помощью <legend>.
<label>Date of birth: <inputtype="text"size="10"/></label>
7
</fieldset>
8
</form>
6. <label>
Тег <label> никак не влияет на стиль. Он влияет на функциональность страницы.
<label> используется для определения метки
элемента ввод. Метка сама воспринимает нажатия кнопки мыши, делая
активным соответствующее поле ввода. Такое свойство меток действует для
текстовых полей и радио кнопок.
Если нужно придать драматический эффект какому-нибудь выражению, то можно использовать <blockquote>.
По умолчанию до и после элемента будет вставлена пустая строка. Также
будет добавлен отступ для отделения содержащегося в элементе текста от
остального контента.
Пример использования тега blockquote совместно с тегом cite.
3
<cite>Данное предложение заключено в тег <cite>.</cite>
4
</blockqoute>
9. <dl>
Использование списков дает великолепные возможности для организации информации. Каждый знает о <ul>, но как часто вы используете <ol> и <dl>?
Вероятно название "список определений" может смутить начинающего
разработчика и заставить его думать, что такой список можно использовать
только для вставки определений и условий. Однако такое положение не
соответствует действительности.
Типы списков
Неупорядоченный список (ul)
Упорядоченный список (ol)
Список определений (dl)
Что они делают
Неупорядоченный список (ul): список с указателями точками
Упорядоченный список (ol): пронумерованный список
Список определений (dl): Список с определениями элементов
Причины использования списков
Последовательный стиль контента
Просто создать
Универсальны
Способ вывода информации каждым типом списка отличается от другого. Наверняка не нужно останавливаться на <ul> и <ol>, но структура списка определений требует дополнительных разъяснений.
Вместо определения элемента списка (<li>), мы используем два тега: <dt> и <dd>. <dt> определяет каждый пункт списка, а <dd> описывает выше стоящий пункт. Ниже приведен список в соответствии с ранее показанным кодом списка определений.
Пункт списка #1
Определение для пункта списка #1
Пункт списка #2
Определение для пункта спсика #2
10. '(и другие символы ASCII )
При использовании HTML нужно использовать коды ASCII,
когда требуется вставить какой-нибудь символ. Такое правило требует
дополнительных действий, но оно гарантирует, что все символы будут
правильно выведены на экран пользователя, и браузер не воспримет их как
часть разметки. Вам никогда не попадался какой-нибудь текст, который
отображается неправильно? Обычно проблемный текст создается с
использованием кавычек, апострофов, знаков больше-меньше и так далее.
Таких символов на самом деле не много, и стоит запомнить их коды ASCII.
| Категория: HTML и CSS | Добавил: ЛисёноChik
| Дата: 14.01.2011, 12:08 | Просмотров: 902 |Загрузок: 0
| Рейтинг: 0.0/0