IMG	PDA версия	тел. +7(98I) 7608865
		Вертикальный текст

абракадабра :-)

<-предыдущая следующая ->

Необходимо, чтобы текст в ячейках с классом "vertical" при отображении в браузере имел вертикальное направление "снизу-вверх"
Средствами CSS это возможно реализовать только в Internet Explorer, воспользовавшись свойством writing-mode. Для необходимого направления текста придётся воспользоваться фильтрами flipH и flipV
А как же быть с остальными браузерами, которые не поддерживают ни фильтры, ни свойство writing-mode?
На ум приходит, пожалуй, только одно - заменить текстовое содержимое на картинку. Но уж, конечно, не хочется делать это ручками, воспользуемся способностью основных браузеров генерировать SVG-изображения.
Scalable Vector Graphics (SVG) (масштабируемая векторная графика), язык, основанный на XML, разрабатываемый консорциумом W3C. SVG позволяет создавать анимацию для каждого элемента, позволяет управлять элементами с помощью скриптов через DOM, JavaScript, ECMAScript или с помощью любого другого скриптового языка, который поддерживается SVG-программой. В SVG разработчику доступны многие основные элементы, включая окружности, прямоугольники, эллипсы, многоугольники, кривые и текст. Так же как и в HTML, отображением элементов можно управлять с помощью стилей (CSS2), либо напрямую с помощью атрибутов.
Наша задача фактически сводится к созданию SVG-разметки, которой мы заменим текст в нужных нам ячейках.

как это выглядит:

Сроки наблюдения, сут			3	6
Содержание основных клеточных элементов, %	Нейтрофилы	Хлоргексидин	49.3	31.5
		Левосин	43.4	25.3
		Левосин + прополис	32.5	22.3
	Макрофаги	Хлоргексидин	1.0	1.4
		Левосин	2.1	1.3
		Левосин + прополис	4.1	3.8
	Лимфоциты	Хлоргексидин	1.1	3.5
		Левосин	1.9	2.9
		Левосин + прополис	6.6	2.7
	Фибробласты	Хлоргексидин	1.0	1.0
		Левосин	1.8	2.3
		Левосин + прополис	4.1	3.9

Сроки наблюдения, сут			3	6
Содержание основных клеточных элементов, %	Нейтрофилы	Хлоргексидин	49.3	31.5
		Левосин	43.4	25.3
		Левосин + прополис	32.5	22.3
	Макрофаги	Хлоргексидин	1.0	1.4
		Левосин	2.1	1.3
		Левосин + прополис	4.1	3.8
	Лимфоциты	Хлоргексидин	1.1	3.5
		Левосин	1.9	2.9
		Левосин + прополис	6.6	2.7
	Фибробласты	Хлоргексидин	1.0	1.0
		Левосин	1.8	2.3
		Левосин + прополис	4.1	3.9

Если браузер поддерживает SVG, то в соответствующих ячейках текст отобразится должным образом. В Internet Explorer замену не производим, так как для него существует упомянутое выше простое решение, кроме того, для отображения SVG в IE нужны внешние плагины.

Создание эксклюзивных сайтов, юзибилити анализ и бесплатный анализ под запросы основных поисковых машин

Контактная информация :
тел. +7(98I) 7608865

Полная карта сайта