Подтвердить что ты не робот

Как изменить прозрачность текста в HTML/CSS?

Я очень новичок в HTML/CSS, и я пытаюсь отобразить некоторый текст как прозрачный на 50%. Пока у меня есть HTML для отображения текста с полной непрозрачностью

<html><font color=\"black\" face=\"arial\" size=\"4\">THIS IS MY TEXT</font></html>

Однако я не уверен, как изменить его непрозрачность. Я пробовал смотреть в Интернете, но я не уверен, что делать с кодом, который я нахожу.

4b9b3361

Ответ 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, вы можете установить цвет фона, а также его прозрачность.