首页 新闻 搜索 专区 学院

html的离线文件在手机上不加载外挂CSS

0
[待解决问题]

学习前端,自己独立制作了一个仿知乎的页面,

电脑上的文件树及html引用方式为:(其中最主要的CSS是css文件夹内的两个文件base.css和common.css)

│ zhihu.html
│ 
├─css
│ base.css
│ common.css

 

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>知乎热榜实战</title>
    <link rel="shortcut icon" href="images/zhihu.ico" />
    <link rel="stylesheet" href="css/base.css" /> 
    <link rel="stylesheet" href="css/common.css" />
    <link rel="stylesheet" href="icomoon/style.css" />
  </head>

  <body>
    ......    

 

然后想看看在手机上显示会是什么样子,于是用usb线把放了网页的文件夹上传到了手机里,但是在手机的文件管理器将html文件用浏览器打开后发现只加载了html部分而不显示CSS。

绝对路径肯定是变化了,但外部CSS导入的相对路径我想是正确的,但怎么html一到手机上就不认外部css了?在手机的文本编辑部把html的外部CSS路径改成直接引用,然后把CSS文件和html放在一起,发现还是只加载html部分。

│ base.css
│ common.css
│ zhihu.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>知乎热榜实战</title>
    <link rel="shortcut icon" href="zhihu.ico" />
    <link rel="stylesheet" href="base.css" />
    <link rel="stylesheet" href="common.css" />
    <link rel="stylesheet" href="style.css" />
  </head>

  <body>
    ...

 

最后还发现,只有把页面传到了FTP服务器后用手机连上FTP服的网址才能看到html有加载CSS,那么离线的情况是怎么一回事?求解。

另一种开始的主页 另一种开始 | 初学一级 | 园豆:140
提问于:2020-12-14 14:25
< >
分享
所有回答(3)
0

肯定是路径问题

不知道风往哪儿吹 | 园豆:1927 (小虾三级) | 2020-12-14 15:07
0

手机直接打开html页面,会引用同一文件夹下的css文件吗?

Mr·林 | 园豆:198 (初学一级) | 2020-12-14 16:42
0

手机的文件系统和电脑不一样,程序拿到的是虚拟路径,只有系统知道虚拟路径和真实路径的匹配关系。浏览器自动识别会被虚拟路径带偏,拼出错的资源路径,肯定读不到嘛。手机是故意的,为了安全性。

coredx | 园豆:626 (小虾三级) | 2021-01-07 19:10
清除回答草稿
   您需要登录以后才能回答,未注册用户请先注册