Хабр Курсы для всех
РЕКЛАМА
Практикум, Хекслет, SkyPro, авторские курсы — собрали всех и попросили скидки. Осталось выбрать!
Хабр доступен 24/7 благодаря поддержке друзей
Комментарии 25
> Надеюсь, что в следующих обновлениях выйдет наш долгожданный спецсимвол и мы не будем больше извращаться.
Да будем ) Будем использовать спецсивол, а так же будем поддерживать тех, кто еще не обновился, ну и пару-тройку вариантов верстки для версий IE.
Традиция такая.
Да будем ) Будем использовать спецсивол, а так же будем поддерживать тех, кто еще не обновился, ну и пару-тройку вариантов верстки для версий IE.
Традиция такая.
Не помню в каком языке, но есть похожий символ — ք
Вики говорит армянский en.wiktionary.org/wiki/%D6%84
так есть же символ рубля — ₷ (U+20B7)
но тут уже главное, что бы в шрифте он присутствовал
но тут уже главное, что бы в шрифте он присутствовал
Нет, это специмилло.
Я не знаю, что такое «специмилло», но Ashot совершенно прав. Демо-пруф: sassmeister.com/gist/8145368
Однако, есть проблема. Позиция знака рубля в Unicode еще не утверждена, поэтому в шрифтах PT знак рубля вставили сразу во много позиций. Эти позиции уже начали разбирать на другие знаки, поэтому наиболее безопасно использовать последнюю — 20CF, пока окончательная позиция знака рубля не будет утверждена официально.
Однако, есть проблема. Позиция знака рубля в Unicode еще не утверждена, поэтому в шрифтах PT знак рубля вставили сразу во много позиций. Эти позиции уже начали разбирать на другие знаки, поэтому наиболее безопасно использовать последнюю — 20CF, пока окончательная позиция знака рубля не будет утверждена официально.
en.m.wikipedia.org/wiki/Spesmilo
В Уникоде есть символ спесмило, у меня выше отображается именно он. Проблема в том, что в некоторых шрифтах решили вместо него рисовать рубль, костыль такой вот. Я считаю, что потакать этому нельзя.
В Уникоде есть символ спесмило, у меня выше отображается именно он. Проблема в том, что в некоторых шрифтах решили вместо него рисовать рубль, костыль такой вот. Я считаю, что потакать этому нельзя.
Знак рубля утвержден официально, и появление его в шрифтах — дело времени. Скоро использование нативного знака рубля станет чуть ли ни единственным способом его изображать, как это сейчас делается со знаками доллара и евро.
Другое дело, что рубль появится не во всех шрифтах, и необходимость быть внимательным с выбором шрифта сохраняется. Почему «этому нельзя потокать», я не понимаю.
Другое дело, что рубль появится не во всех шрифтах, и необходимость быть внимательным с выбором шрифта сохраняется. Почему «этому нельзя потокать», я не понимаю.
Хорошая головоломка для пятничного утра. Накидал на коленке небольшую less-примесь, которая позволила сделать следующее jsbin.com/OdatoVu/1. Конечно, не идеально, но это хотя бы направление для работы.
Суть: вместо знака подчеркивания лучше использовать – Этот псевдосимвол будет изменяться со шрифтом и не придется подгонять размеры штриха под размер надписи.
Суть: вместо знака подчеркивания лучше использовать – Этот псевдосимвол будет изменяться со шрифтом и не придется подгонять размеры штриха под размер надписи.
А можно скрин с третьим вариантом?! Как выглядит?
cssdesk.com/
вот тут онлайн редактор.
сверху P
снизу
.rub{ display: inline-block; font-size: 24px; line-height: 7px; border-bottom: 1px solid #000000; width:0.4em;}
вот тут онлайн редактор.
сверху P
снизу
.rub{ display: inline-block; font-size: 24px; line-height: 7px; border-bottom: 1px solid #000000; width:0.4em;}
Идея хорошая, но, к сожалению, у данного варианта есть несколько нежелательных, как минимум для меня, эффектов: знак рубля смещается вниз относительно основной линии всего остального текста, для каждого размера шрифта нужно подбирать смещение нижней рамки и перечеркивание идет на всю ширину знака, а на сайте ЦБ мы видим, что перечеркивание должно быть короче. Поэтому, немного поигравшись со стилями, представляю на суд свою версию формирования знака рубля:
.amount {
font-family: sans-serif;
font-size: 120px;
}
.rub {
position: relative;
}
.rub:before {
content: «Р»;
}
.rub-line {
position: absolute;
top: .05em;
left: 0px;
}
.rub-line:before {
content: "-";
}
1000
Проверил в различных браузерах и все отобразилось хорошо, причем не зависимо от вида шрифта и его размера.
.amount {
font-family: sans-serif;
font-size: 120px;
}
.rub {
position: relative;
}
.rub:before {
content: «Р»;
}
.rub-line {
position: absolute;
top: .05em;
left: 0px;
}
.rub-line:before {
content: "-";
}
1000
Проверил в различных браузерах и все отобразилось хорошо, причем не зависимо от вида шрифта и его размера.
Мой вариант:
Демо: sassmeister.com/gist/8145219
Имхо, самый просто и лаконичный вариант. Как и в других вариантах, верхний отступ перекладины зависит от используемого начертания шрифта. Для Tahoma и Verdana, например, отступ должен быть больше, чем для Arial.
10 000 <span class=rouble>Р</span>
.rouble {
position: relative; }
.rouble:before {
display: block;
content: "–";
position: absolute;
top: 0.05em; }
Демо: sassmeister.com/gist/8145219
Имхо, самый просто и лаконичный вариант. Как и в других вариантах, верхний отступ перекладины зависит от используемого начертания шрифта. Для Tahoma и Verdana, например, отступ должен быть больше, чем для Arial.
Зарегистрируйтесь на Хабре, чтобы оставить комментарий
Символ рубля при помощи CSS