Повёрнутый текст :: Web-программирование :: Компьютерный форум Ru.Board

Новости • Файловые архивы
Поиск • Активные темы • Топ лист
Правила • Кто в on-line?

Вход • Забыли пароль? • Первый раз на этом сайте? • Регистрация

Компьютерный форум Ru.Board » Интернет » Web-программирование » Повёрнутый текст

Модерирует : Cheery
Версия для печати • Подписаться • Добавить в закладки

Cybermouse Junior Member	Редактировать \| Профиль \| Сообщение \| Цитировать \| Сообщить модератору Подскажите пожалукйста, как с помощью css или чего другого печатать немного наклонный текст?
	Всего записей: 129 \| Зарегистр. 18-04-2006 \| Отправлено: 16:36 04-11-2006 \| Исправлено: Cybermouse, 16:37 04-11-2006

Brodyaga

Silver Member

Cybermouse
Немного наклонный куда? Повернутый под углом по отношению к оси расположения текста?

----------
Damn Metal

Всего записей: 2713 | Зарегистр. 07-01-2006 | Отправлено: 16:54 04-11-2006

Cybermouse Junior Member	Редактировать \| Профиль \| Сообщение \| Цитировать \| Сообщить модератору Ну да, не по горизонтали, как обычно, а наклонённый. Ну, например градусов на 15.... т.е. левый угол ниже чем правый. Вот, что я имею ввиду
	Всего записей: 129 \| Зарегистр. 18-04-2006 \| Отправлено: 16:58 04-11-2006

Brodyaga

Silver Member

Код:

<html>
<head>
<script>

function rot(i)
{
if (!document.all.aDiv.style.filter)
document.all.aDiv.style.filter = 'progid:DXImageTransform.Microsoft.BasicImage(rotation=' + i + ')';
else
document.all.aDiv.filters.item('DXImageTransform.Microsoft.BasicImage').Rotation = i;
} // ends function rot(void)

</script>
</head>
<body>
<input type="button" value="Rotate by 90 deg" onclick="rot(1);" />
<div id="aDiv" style="width: 100px; height: 100px; background-color: lime;">
<table width="100%" height="100%">
<tr>
<td align="center" valign="middle">Kibology for all.</td>
</tr>
</table>
</div>
</body>
</html>

Но таким способом можно поворачивать только на 90-кратные градусы, передавая в качестве параметра целое число n+Работает только в IE.
Повороты элементов-вещь сложная и лучше обходиться без неё.

----------
Damn Metal

Всего записей: 2713 | Зарегистр. 07-01-2006 | Отправлено: 17:10 04-11-2006

Cybermouse Junior Member	Редактировать \| Профиль \| Сообщение \| Цитировать \| Сообщить модератору ТОлько на 90 градусов? А на 10 никак?
	Всего записей: 129 \| Зарегистр. 18-04-2006 \| Отправлено: 17:53 04-11-2006

Brodyaga

Silver Member

Нет, вероятно

Добавлено:
Ты можешь подождать перехода всех браузеров на CSS3 и юзать такую конструкцию:
glyph-orientation-vertical:35deg;
если я правильно понял документацию на http://www.w3.org/TR/2003/CR-css3-text-20030514/#glyph-orientation-vertical

----------
Damn Metal

Всего записей: 2713 | Зарегистр. 07-01-2006 | Отправлено: 17:54 04-11-2006

Cybermouse Junior Member	Редактировать \| Профиль \| Сообщение \| Цитировать \| Сообщить модератору Гм... ждать можно до бесконечности. ТОда единственный вариант - сломать все браузеры кроме CSS3 =) А через другие языки тож никак нельзя повернуть?
	Всего записей: 129 \| Зарегистр. 18-04-2006 \| Отправлено: 18:12 04-11-2006

Brodyaga

Silver Member

Cybermouse
Нет, вряд ли. Проблема в чем:
браузер отображает элементы в виде блоков, любые элементы являются прямоугольниками, кроме area на картах-картинках.
А поворот элемента превращает его силует в нечто неподвластное законам блочной разметки, поэтому повороты текста на любые величины кроме кратных 90^o не предусмотрены. Видимо и в CSS3 только величины 90/180/270/360deg

----------
Damn Metal

Всего записей: 2713 | Зарегистр. 07-01-2006 | Отправлено: 18:21 04-11-2006

Kokoc Advanced Member	Редактировать \| Профиль \| Сообщение \| Цитировать \| Сообщить модератору Если уж совсем приспичило - то можно на PHP+GD2 рисовать картинку c надписью под любым углом - функций ImageTTFText()
	Всего записей: 793 \| Зарегистр. 06-06-2002 \| Отправлено: 00:22 05-11-2006

Компьютерный форум Ru.Board » Интернет » Web-программирование » Повёрнутый текст

Реклама на форуме Ru.Board.

Powered by Ikonboard "v2.1.7b" © 2000 Ikonboard.com
Modified by Ru.B0ard
© Ru.B0ard 2000-2024

BitCoin: 1NGG1chHtUvrtEqjeerQCKDMUi6S6CG4iC