Как изменить прозрачность текста в HTML/CSS?
Я очень новичок в HTML/CSS, и я пытаюсь отобразить некоторый текст как прозрачный на 50%. Пока у меня есть HTML для отображения текста с полной непрозрачностью
<html><font color=\"black\" face=\"arial\" size=\"4\">THIS IS MY TEXT</font></html>
Однако я не уверен, как изменить его непрозрачность. Я пробовал смотреть в Интернете, но я не уверен, что делать с кодом, который я нахожу.
Ответы
Ответ 1
Проверьте Opacity, вы можете установить это свойство css в div, <p>
или используя <span>
, который вы хотите сделать прозрачным
И, кстати, тег шрифта устарел, используйте css для стилирования текста
div {
opacity: 0.5;
}
Изменить: этот код сделает весь элемент прозрачным, если вы хотите сделать ** просто текст ** прозрачный чек @Mattias Buelens answer
Ответ 2
opacity
применяется ко всему элементу, поэтому, если у вас есть фон, граница или другие эффекты для этого элемента, они также станут прозрачными. Если вы хотите, чтобы текст был прозрачным, используйте rgba
.
#foo {
color: #000; /* Fallback for older browsers */
color: rgba(0, 0, 0, 0.5);
font-size: 16pt;
font-family: Arial, sans-serif;
}
Также, поверните далеко, далеко от <font>
. Теперь у нас есть CSS.
Ответ 3
Просто используйте тег rgba
в качестве цвета текста. Вы можете использовать opacity
, но это повлияет на весь элемент, а не только на текст. Скажем, у вас есть граница, это сделает ее прозрачной.
.text
{
font-family: Garamond, serif;
font-size: 12px;
color: rgba(0, 0, 0, 0.5);
}
Ответ 4
Лучшее решение - посмотреть на тег "непрозрачность" элемента.
Например:
.image
{
opacity:0.4;
filter:alpha(opacity=40); /* For IE8 and earlier */
}
Итак, в вашем случае это должно выглядеть примерно так:
<html><span style="opacity: 0.5;"><font color=\"black\" face=\"arial\" size=\"4\">THIS IS MY TEXT</font></html>
Однако не забывайте, что тег не поддерживается в HTML5.
Вы также должны использовать CSS:)
Ответ 5
Легко! после вашего:
<font color=\"black\" face=\"arial\" size=\"4\">
добавить это:
<font style="opacity:.6">
вам просто нужно изменить ".6" для десятичного числа от 1 до 0
Ответ 6
Как насчет атрибута css opacity
? 0
до 1
.
Но тогда вам, вероятно, нужно будет использовать более явный элемент dom, чем "font". Например:
<html><body><span style=\"opacity: 0.5;\"><font color=\"black\" face=\"arial\" size=\"4\">THIS IS MY TEXT</font></span></body></html>
В качестве дополнительной информации я бы, конечно, предложил вам использовать объявления CSS за пределами ваших элементов html, но также попробуйте использовать стиль шрифта css вместо тега html шрифта.
Для генератора стилей с поперечным браузером css3 просмотрите http://css3please.com/
Ответ 7
Нет свойства CSS, например background-opacity, которое можно использовать только для изменения непрозрачности или прозрачности фона элемента, не затрагивая ребенка элементов, с другой стороны, если вы попытаетесь использовать свойство непрозрачности CSS, это не только изменит непрозрачность фона, но и изменяет непрозрачность всех дочерних элементов.
В такой ситуации вы можете использовать цвет RGBA, введенный в CSS3, который включает альфа-прозрачность как часть значения цвета. Используя цвет RGBA, вы можете установить цвет фона, а также его прозрачность.