Почему прямоугольная цитата (& rsaquo;) не вертикально выровнена?

Я попытался написать название как можно лучше, но я не уверен, как точно описать, что здесь происходит, поэтому не стесняйтесь его исправить.Почему прямоугольная цитата (& rsaquo;) не вертикально выровнена?

Я хотел использовать> правую угловую цитату (& rsaquo;) вместо котировки с прямым углом (>), а while & rsaquo; символ короче, чем >, он сидит в нижней части строки, аналогично периоду (.). Это затрудняет вертикальное выравнивание символа, и когда я устанавливаю его на 42 пикселя, это заметно.

Есть ли какой-либо другой символ, который я могу использовать, или любым способом, которым я могу вертикально выровнять это? Возможно, это мой шрифт, но я не использую ничего особенного.

Пример двух символов ниже. Первый - это правая угловая скобка >, а вторая - & rsaquo; который находится внизу.

источник

2016-04-12 Alesana

Я абсолютно уверен, что выравнивание символов полностью зависит от того, как шрифт определяет глиф. Вот почему он не выровнен по вертикали. – amphetamachine

Спасибо; похоже, что это единственная причина, по которой это происходит. Я рассмотрю другие способы, чтобы получить вертикальное выравнивание, например, просто позиционируя его выше или используя другой шрифт. – Alesana

Попробуйте изолировать символ в span и использовать свойства CSS line-height и font-size вертикальной выровняйте его.

Кроме того, стандартные шрифты, такие как: arial, verdana и т. Д. по умолчанию выравниваются по вертикали.

See example

источник

2016-04-12 23:32:50 Oriol

Я играл с изолированным персонажем, используя высоту линии, но не смог заставить его работать. В Arial (даже в вашем примере) персонаж все еще сидит внизу, в verdana он более вертикально выровнен, но также более острый, чем мне хотелось бы. Думаю, я попытаюсь найти шрифт, который отображает его так, как это лучше. – Alesana

(извините за задержку) см. Обновленный пример. – Oriol

Такое же влияние, что и в примере, может быть также реплицировано просто с помощью padding-bottom :-(x) px ;, потому что установка высоты строки, меньшей, чем шрифт, только трюки, чтобы она выглядела вертикально. Я хотел избежать этого, поэтому я спросил, почему он не был выровнен по вертикали, если бы я мог по-настоящему вертикально выровнять символ, а не обманывать его. Реальный ответ на мой вопрос заключается просто в том, что в шрифте Arial, & rsaquo; символ не выровнен по вертикали. amphetamachine поставил правильный ответ на мой вопрос в комментариях, но, к сожалению, я не могу принять его ответ, поскольку это комментарий. – Alesana

Как amphetamachine уже ответил, это зависит от того, как конкретный шрифт вы используете определяет глиф.

Лучший способ, который я нашел, чтобы исправить это (без жестко скопированного смещения пикселей), состоит в том, чтобы поместить символ в свой собственный диапазон, а затем применить: vertical-align: PERCENTAGE%. (В моем случае вертикально-выровненный: 11% работал хорошо, но это будет зависеть от шрифта).

Выполнение этой функции в процентах означает, что она сохранит ту же позицию даже при разных размерах шрифта.

источник

2017-01-26 21:23:18 Brian

Почему прямоугольная цитата (& rsaquo;) не вертикально выровнена?

ответ

Смежные вопросы