Приветствую вас снова на своем маленько блоге!
Погодка подстать весенней, хотя на дворе еще как бы зима (зимний месяц). Но это не повод не писать в свой блог нужные для людей статьи.
Итак: сегодня я вам расскажу о десятке полезных тегов в HTML. Поехали!
Наверное каждый кто читает это знает что такое HTML. Сейчас я покажу 10 тегов которые чаще всго не используют начинающие верстальщики, веб мастера. Но на само деле они очень полезны и их надо использовать.
1.Комментарии <!-–>
Любая книга о программировании покажет вам что использование комментариев, описание кода то что он делает, очень важно и нужно. HTML это не программирование, но использовать комментарии также нужно, конечно когда вы пишете маленький код, страничку комментарии можно и не делать, но когда вы пишете что нибудь основательное с большим количеством HTML кода можно очень легко запутаться где что находится, вот тут то и комментарии приходят на помощь. Выглядят они примерно так:
<!— Начало навигации —> <ul> <li>элемент 1</li> <li>элемент 2</li> </ul> <!— Конец навигации —> <!— Начало контента —> <p>Контент</p> …
2. Элементы таблицы – <thead>,<tbody> и <tfoot>
Конечно их можно опустить, но в дальнейшем очень часто нужно бывает стилизовать таблицу, отделить начало таблицы от тела и конца или еще чего нибудь. В этом случае очень удобно использовать именно эти элементы. Вот пример использования:
<table> <thead> <tr> <td>Item</td> <td>Qty</td> </tr> </thead> <tfoot> <tr> <td>Sum</td> <td>7</td> </tr> </tfoot> <tbody> <tr> <td>#1</td> <td>3</td> </tr> <tr> <td>#2</td> <td>4</td> </tr> </tbody> </table>
3. <optgroup>
Выпадающие списки очень удобный способ представления информации для выбора. Очень хорошая вешь для селектов <optgroup>, с помощью этого тега возможно создавать категории в выпадающих списках, примерно так:
<select> <optgroup label=»Английские клубы»> <option value=»Челси»>Челси</option> <option value=»Арсенал»>Арсенал</option> </optgroup> <optgroup label=»Испанские клубы»> <option value=»Реал Мадрид»>Реал Мадрид</option> <option value=»Барселона»>Барселона</option> </optgroup> </select>
4. Заголовки <h1>,<p>,<h3>,<h4>,<h5> и <h6>
Я знаю все используют теги заголовок. Но честно говоря я не помню когда я последний раз использовал <h3> или другие поменьше. Потому что я забываю о этих тегах и чаще использую отдельный <div> для стилизации текста. Не делайте того же каждый тег нужно использовать по предназначению.
5.<fieldset> и <legend>
Мне нравятся сайты в которых легко найти нужную информацию, в которых элементы логически отделены друг от друга. <fieldset> группирует элементы формы рисуя прямоугольник вокруг элементов, еще можно добавить подпись к группе элементов с помощью <legend>. Пример кода:
<form> <fieldset> <legend>Группа 1: </legend> <label>Имя: <input type=»text» size=»30″ /></label> <label>Email: <input type=»text» size=»30″ /></label> <label>Дата рождения: <input type=»text» size=»10″ /></label> </fieldset> </form>
6. <label>
Один из моих самых любимых HTML тегов. Label добавляет только функциональность к форме. <label> нужен для создания ярлыков для элементов формы. При использовании <label> текст лейбла становится кликабельным. При нажатии на текст лейбла элемент формы находящийся в этом же лейбле становится активным. Пример:
<form> <label>Имя: <input type=»text» size=»30″ /></label> <label>Муж: <input type=»radio» name=»sex» /></label> <label>Жен: <input type=»radio» name=»sex» /></label> </form>
7. <blockquote>
Если вы хотите выделить текст, выделить цитату, вы можете использовать тег <blockquote>. Пустое пространство по умолчанию вставляется перед и после элемента. Чаще его используют для выделения цитат, но как вы сами видели я его использую не совсем по предназначению, я им чаще всего выделяю заголовки и т.д. выглядит он у меня вот так:
Вот здесь должен быть текст
8. <cite>
В принципе то же самое что и blockquote но его используют для выделения списка литературы, и еще чего нибудь в этом роде.
9. <dl>
Наверное все знают что существует такой тег как <ul> для создания неупорядоченных списков, и еще такой <ol> для упорядоченных, но мало кто знает о таком теге как <dl> он нужен для создания списка определений, атрибутов у него не так много, но вообще полезная тож вещь.
10. ASCII
Как правило новички практически не используют ASCII, особенно он нужен при написании технических текстов в которых используются знаки которые не выводятся такие как <, > и т.д. вот ссылка на всю таблицу ASCII.
Получается что на этом все! Так же буду рад вашим комментариям, на которые постараюсь ответить. И чтобы быть в курсе новостей на блоге — подписывайтесь на обновления. До скорых встреч.
С вами был — ваш Юрич!
