HTML-тег с пользовательским шрифтом вызывает изменение цвета даже после закрывающего тега . ⇐ Html

[Anonymous]

У меня возникла непонятная проблема с базовым HTML. При использовании пользовательского шрифта я заметил, что тег приводит к тому, что оттенок цвета становится темнее после закрывающего тега. Кажется, это сохраняется до тех пор, пока текст не завернется, а затем снова приобретет «нормальный» оттенок.
Я использую Firefox для просмотра HTML. Я протестировал несколько цветов, но только более светлые цвета имеют заметную разницу. Я приложу изображение только одного цвета, чтобы не загромождать. Текст в квадратных скобках '[]' — это текст, содержащийся в теге .



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

Код: Выделить всё

@font-face {
font-family: "custom";
font-weight: 400;
font-style: normal;
src: url(data:font/woff2;base64,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)
}

main {
flex: 1;
}
body {
display: flex;
flex-direction: column;
background: black;
font-family: "custom";
font-weight: 400;
color: #c09c9c;
}

Код: Выделить всё

Lorem ipsum dolor sit amet, consectetur adipiscing elit,
sed do [eiusmod tempor[/b]]  incididunt ut labore et dolore magna aliqua.[b]    Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris
nisi ut aliquip ex ea commodo consequat.

Duis aute irure dolor in reprehenderit in [voluptate[/b]] velit esse
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat
cupidatat non proident, sunt in culpa qui officia deserunt mollit
anim id est laborum.

Известна ли это проблема? Я не смог найти никакой информации по этому поводу. Я не тестировал другие браузеры, поэтому не знаю, специфично ли это для Firefox. HTML-рендеринг Stack Overflow, кажется, правильно отображает цвет, так что, может быть, это так?

Подробнее здесь: https://stackoverflow.com/questions/798 ... closing-ta