Я хочу применить два разных цвета и шрифтов к текстовому логотипу.Применение двух цветов атрибутов и размера шрифта для одного и того же селектора
Представьте логотип как: «Кайро-шайбы».
Я хотел бы сделать «Каир» в зеленом тексте, и я хотел бы сделать «Шайбы» в черном тексте с меньшим размером шрифта и начиная с верхней правой части «Каира». Точно так же вы должны записать значение экспоненты в число в исчислении.
Как это можно достичь?
Мы уже имеют тег, который делает это: <sup>
Per MDN
Элемент HTML Superscript (
<sup>) определяет диапазон текста, который должен отображаться по типовым причинам, выше и часто меньше, чем основной интервал текста.
span {
font-size: 72px;
color: green;
}
sup {
vertical-align: super;
font-size: 32px;
color: red;
}<span>Cairo<sup>Washers</sup></span>Большое вам спасибо. – Haid
Вот способ, как вы можете achive в CSS:
https://jsfiddle.net/Alteyss/e9aj3qgs/
div {
display: inline-block;
}
#a {
color: red;
font-size : 30pt;
}
#b {
color: black;
font-size : 10pt;
vertical-align: top;
}
Я совет вам создать изображение вместо этого, это лучше на веб-сайте ...
Большое вам спасибо. Хотя я не буду использовать этот фрагмент кода для текстового логотипа. Это дало мне представление о чем-то другом. Что касается изображения, наш логотип использует черный и зеленый текст helevetica. Я думал, что было бы необязательно забивать папку с содержимым огромным png-изображением. – Haid
p{
color:green;
}
p span{
color:black;
}
<p>Cairo <span>Washers</span></p>
Добро пожаловать на Stack Overflow @Haid. Чтобы мы могли помочь вам, пожалуйста, включите код (HTML и CSS), показывая, что вы делали до сих пор. –
Если это ваш логотип, лучше нарисовать его и использовать в качестве изображения. Таким образом, вы убедитесь, что он выглядит одинаково в каждом браузере. – akasummer