HTML. Атрибуты тега и списки (Урок 4)

Оглавление:

Атрибут  – это какой-то указатель, отличительный знак, который придает элементу какое-то свойство, что выделяет его из других. В коде html тоже есть атрибуты тегов. Сейчас у нас все абзацы одинаковые. Везде мы их просто открываем и закрываем. Никаких отличий нет. Соответственно браузер все наши абзацы отображает одинаково. Все абзацы выровнены по левому краю (по умолчанию), имеют одинаковый шрифт, цвет шрифта и т.д.

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

К оглавлению ↑

Атрибут <align>

Если мы хотим выделить какой-то из абзацев, то мы должны задать ему атрибут тега html.  Например, мы хотим выровнять какой-то абзац по центру. Это мы можем сделать с помощью атрибута align.  Но просто написать этот атрибут после тега еще недостаточно. Поэтому следует после align написать знак присваивания и написать, как именно мы хотим выровнять абзац. Вот как это выглядит.

html атрибут align

 

Вот так это выглядит в браузере

html атрибут align вид в браузере

 

Данный атрибут со значением left выровнит текст по левом краю, а right — по правому.

 

К оглавлению ↑

Атрибуты <ol> и <ul>

Теперь давайте разберем, что такое списки HTML и как они формируются. Для их создания используются два основных тега <ol> (упорядоченный спиок) и <ul> (неупорядоченный список). Давайте создадим каждый из них.

Возьмите 4 строки любого текста и поместите их внутрь тега <ol>:

html списки

Теперь каждую строку поместите в свой тег списка <li>:

html тег li

Давайте посмотрим наш созданный упорядоченный список в браузере. Упорядоченный – это значит, что он будет обладать какими-то маркерами в виде цифр, букв либо в виде еще каких-то символов.

html списки li

 

Как  видим, у нас получился готовый список, пронумерованный цифрами.

Теперь  второй тип списка – это неупорядоченный список. Для данного списка  в качестве указателей  списка используются черные маркеры.

html

 

Элементы списка также выделяются тегами <li>.  Давайте сохраним страницу и посмотрим, что у нас получилось.

html список

Давайте как раз рассмотрим еще один пример. Создадим ненумерованный список с квадратными маркерами при помощи атрибута type . Для этого для тега <ul> пропишем атрибут  type и присвоим ему значение square (квадрат).

html атрибут type

Такой код скажет браузеру, что элементы списка нужно выделять квадратными маркерами.

html fnhb,ens

Значение атрибута circle заменит квадрат на пустой круг. Пробуйте!!!

На этом урок закончим и увидимся на следующем занятии, где изучим как вставлять изображения!

Удачи вам! До скорых встреч на страницах блога VyacheslavDanilov.ru


Вам также понравится...

Смотри и удивляйся:
Десерт

*посмотреть еще ролик можно обновив страницу в браузере

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *