Главная Обратная связь

Дисциплины:

Архитектура (936)
Биология (6393)
География (744)
История (25)
Компьютеры (1497)
Кулинария (2184)
Культура (3938)
Литература (5778)
Математика (5918)
Медицина (9278)
Механика (2776)
Образование (13883)
Политика (26404)
Правоведение (321)
Психология (56518)
Религия (1833)
Социология (23400)
Спорт (2350)
Строительство (17942)
Технология (5741)
Транспорт (14634)
Физика (1043)
Философия (440)
Финансы (17336)
Химия (4931)
Экология (6055)
Экономика (9200)
Электроника (7621)






Установка свойства text-align



 

Мы можете воспользоваться Свойством text-align можно воспользоваться для управления горизонтальным выравниванием текста элемента. Это свойство будет работать только в том случае, если его использовать для элемента типа block. Оно воздействует как на сам элемент, так и на дочерние элементы, которые он содержит, независимо от того, относятся ли они к типу block или inline. (Об элементах block и inline рассказывалось в разделе “Установка свойства display”.)

Свойство text-align воздействует на выравнивание текста внутри области содержимого текста. По умолчанию область содержимого текста занимает практически полную ширину окна браузера. Однако, можно модифицировать как ширину, так и положение области текста элемента (об этом будет рассказано в следующих разделах).

Свойству text-align можно назначить одно из следующих трех ключевых слов:

· left. Выравнивает каждую строку по левому краю. Используем следующее правило для XML-документа из Листинга 1.6 (в добавление к остальным правилам, содержащимся в таблице стилей из Листинга 1.5, за исключением установки свойства background-image, которая удалена):

 

РОЕМ {text-align: left}

 

Поэма будет выглядеть, как показано на следующем рисунке.

Рисунок 22. Использование значения left для свойства text-align

 

· right. Выравнивает каждую строку по правому краю. Так, следующее правило выравнивает текст поэмы вправо, как показано на следующем рисунке.

РОЕМ {text-align: right}

Рисунок 23. Использование значения right для свойства text-align

 

· center. Центрирует строки по горизонтали. Например, следующее правило центрирует весь текст поэмы, как показано на рисунке ниже.

 

РОЕМ {text-align: center}

Рисунок 24. Использование значения center для свойства text-align

 

Установка свойства text-indent

 

Чтобы задать отступ для первой строки текста элемента, можно воспользоваться свойством text-indent. Для данного свойства можно устанавливать все виды значений размеров. Например, следующее правило задает отступ для первой строки элемента VERSE, равный трехкратной высоте ее шрифта:

 

VERSE {text-indent: 3em}

 

Альтернативой является задание величины отступа в процентах от полной ширины текста элемента. Например, это правило задает смещение первой строки элемента VERSE на половину ширины элемента:

 

VERSE {text-indent:50%}

 

Можно задать отрицательное значение - в размерных единицах или в процентах - чтобы сдвинуть первую строку влево относительно других строк. Однако если просто присвоить отрицательное значение свойству text-indent, первая часть строки может оказаться скрытой. Чтобы избежать этого, необходимо установить для элемента левое поле. Например, следующее правило устанавливает левое поле шириной в 4еm (margin-left:4em), а затем сдвигает первую строку на 2em (text-indent:-2еm), создавая висячий отступ.

 


Эта страница нарушает авторские права

allrefrs.ru - 2018 год. Все права принадлежат их авторам!