Какой MIME-тип у файлов .css?
MIME-тип (медиатип) для файлов Cascading Style Sheets с расширением .css — text/css. Браузеры не применяют таблицу стилей, если сервер отдал её с неверным типом и при этом задан X-Content-Type-Options: nosniff. Это частая причина ошибок «страница без стилей» на неправильно настроенных серверах и бакетах S3.
Заголовок Content-Type
Content-Type: text/css; charset=utf-8
Текстовым типам следует добавлять charset, чтобы браузер корректно декодировал символы.
Настройка сервера
| Сервер | Конфигурация |
|---|---|
Nginx (mime.types или types {}) | text/css css; |
Apache (.htaccess) | AddType text/css .css |
IIS (web.config) | <mimeMap fileExtension=".css" mimeType="text/css" /> |
| Node.js / Express | res.type('css') или res.setHeader('Content-Type', 'text/css; charset=utf-8') |
| Amazon S3 | Задайте Content-Type: text/css для объекта (метаданные) или передайте --content-type text/css в aws s3 cp |
Нужно ли сжимать файлы .css?
Да. Cascading Style Sheets — это текст, поэтому включение gzip или Brotli для text/css обычно уменьшает объём передаваемых данных на 50–80 %. Убедитесь, что список сжимаемых типов на вашем сервере включает этот тип — проверить можно с помощью теста сжатия сайта.
Почему важен MIME-тип
Браузер решает, что делать с ответом — отобразить, выполнить, воспроизвести или скачать, — по заголовку Content-Type, а не по расширению файла. При X-Content-Type-Options: nosniff неверный тип приводит к тому, что таблицы стилей и скрипты полностью блокируются. Для загружаемых файлов никогда не доверяйте типу, который отправил клиент; проверяйте содержимое файла (его магические байты) на сервере.
Поиск MIME-типов
Найдите любое распространённое расширение файла и MIME-тип с готовыми заголовками Content-Type для копирования.
Часто задаваемые вопросы
Какой MIME-тип у .css?
text/css.Как задать Content-Type для .css в Nginx?
text/css css; есть в блоке types (обычно в /etc/nginx/mime.types), и перезагрузите Nginx.