Как скрывают файл со стилями css?

Question

[Артем]

При просмотре сайтов в DevTools браузера несколько раз видел, что при выборе объекта, например div, рядом с его стилями указана не ссылка на файл css, а написано <style>. Прожимаешь по нему и тебя бросает к пустому html тегу <style></style>.
Дак вот мой вопрос, как это сделать?
Я предполагаю, что это реализовано на js, но подключаемые файлы обфусцированы и там нет никаких ссылок.

spoiler

Comments

[Владислав Лысков]

короче, на левой части скрина не тот тэг style, который на правой

[Артем]

Написано же, выбран элемент .container, я тыкаю по style (куда указывает красная стрелка) и DevTools подсвечивает мне тег style (указанный зеленой стрелкой).

[Артем]

Владислав Лысков, если удалить тег style, на который указывает зеленая стрелка, то все стили кастомные стили с сайта пропадают

[Владислав Лысков]

Артем, можно ссылку на пациента?

[Виктор]

причем здесь style в левой части?

[Ankhena]

Артем, слушайте, сегодня словила почти аналогичный глюк в девтулзах

Answer 1

[Refguser]

Это не css-файл, это инлайн-стили.

Answer 2

[4X_Pro]

Да, всё верно, это происходит, если добавлять стили через JavaScript с помощью конструкций вида

var sheet = window.document.styleSheets[0];
sheet.insertRule('.container { width: 100%; margin: 8px auto }', sheet.cssRules.length);

Подробнее — см. в MDN: https://developer.mozilla.org/en-US/docs/Web/API/C...

Answer 3

[Олег]

Просто вписан css в само тело страницы. Между этими тегами.

Comments

[Артем]

Почему он не отображается? Есть аналогичный style тег в head сайта, там стили отображаются.