2

Дело обстоит следующим образом: Я создал небольшой .html файл, подключил к нему .css стили. Реализовывал всё это на компьютере. Открывал файл через Yandex Browser, Mozilla Firefox - всё работает исправно, все стили подключены. Прописывал внутри .css файла @media запросы, которые применяют соответственные стили под ширину экрана. Собственно, решил проверить, как это всё будет работать на смартфоне. (К слову, все файлы скинул туда в том порядке и папках, как и на компьютере, значит всё подключено по правильным путям). Но когда уже на смартфоне я открываю этот .html документ через любой браузер (Yandex Browser для мобильных, Google Chrome для мобильных), то никакие стили там не отображаются (выглядит файл, как просто вёрстка на html, без css. Значит стили не подключены). Как это понимать и как решить данную проблему: ведь просто перенёс всё на смартфон, но уже нету подключения. Если я не полностью описал проблему, то скажите, что нужно дополнить в комментариях. Заранее спасибо

Путь к .css файлу:

<link rel="stylesheet" href="css/training.css">

Расположение папок и файлов проекта

Содержимое папки css

Только что все стили из .css файла на смартфоне помещал в:

<head>
   <style>
       ...
   </style>
</head>

Работает так то всё хорошо, но оставлять такие стили очень не хотелось бы. Да и вообще проблему решить хочется не таким способом. Не желательно бы все стили держать в одном файле .html. Как минимум это неудобно и не эргономично.

8
  • Я даже указывал полный путь к файлу из корня системной памяти. Это тоже не помогло
    – dude
    15 мар 2020 в 15:28
  • <link rel=stylesheet href="./css/style.css"> 15 мар 2020 в 15:59
  • Точка перед тем же слешем не помогла...
    – dude
    15 мар 2020 в 16:01
  • <link rel=stylesheet href="./css/style.css" type="text/css" > 15 мар 2020 в 16:02
  • 1
    Я тоже обратил внимание на то, что на компе файл открывается как file://, а на телефоне как content://. Буду пробовать.
    – Object417
    6 ноя 2021 в 18:14

2 ответа 2

2

В общем, как уже ранее говорили в комментариях, проблема в том, что на компьютере локальный файл открывается как file:///, а на телефоне как content://. Решить проблему можно 2-мя (3-мя) способами.

  1. Указать путь вручную.
    Выглядеть он будет как-то так: file:///storage/emulated/0/.../index.html
  2. Скачать нормальный проводник.
    Я взял для примера File Manager от File Manager Plus и Total Commander от C. Ghisler. Оба они нормально открывают файлы HTML в браузере (для примера взял Opera Mobile).
  3. Воспользоваться хостингом.
    Да. Всего-то.
-1

Вместо href="css/training.css" напишите href="/css/training.css". Слеш в начале ссылки означает, что путь к файлу будет брать начало с корневого каталога сайта.

1
  • К сожалению, это тоже не помогло
    – dude
    15 мар 2020 в 15:54

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.