CSS-06 外部JS,CSS文件的寻址问题
如果js、css外部文件有使用到相对路径,其相对路径的基准是不一样的
当一个index.html中引入外部的JS和CSS文件时:

在index.css文件中,相对路径的写法是以css文件相对于img图片的位置来写的,所以是../img/big/1.jpg
#wrap ul li {
width: 125px;
height: 125px;
background-image: url("../img/big/1.jpg");
}
而在index.js文件中,是以index.html文件相对于img图片的位置来写的,所以是img/big/1.jpg
$li.css({
'backgroundImage': 'url("img/big/1.jpg")'
})
原因:css和js文件都引入到html文件中,但区别是:
js文件会加载到html文件里面解析后再进行路径寻址,而css文件是不会在html内部解析里面的路径,它是先把路径寻找到,再加载到html文件中去,所以js文件中相对路径参照的是html文件的位置,css文件中相对路径参照的是自己本身文件的位置。
CSS-06 外部JS,CSS文件的寻址问题的更多相关文章
- vue组件如何引入外部.js/.css/.scss文件
可在相应的单vue组件引入相应文件. 1.引入外部.js文件. 2.引入外部.css文件. 使用@import引入外部css,作用域是全局的,也可在相应的单vue组件引入,import并不是引入代码到 ...
- springMVC下jsp引用外部js,css等静态资源的解决方法
直入主题. 1. web.xml对springMVC配置如下: <servlet> <description>Spring MVC配置</description> ...
- Yii2.0 引入外部js css
<script src="<?= Yii::$app->request->baseUrl . '/js/jquery-2.1.1.min.js'?>" ...
- js 动态添加 外部js css 到head标签
function appendJQCDN() { var head = document.head || document.getElementsByTagName('head')[0]; var s ...
- Django导入外部js、css、图片等巨大的坑
初学Django,踩过最大的坑只有之一.至今任然不是很明白. 通常我们导入外部js等文件都是 <script src="myScript.js"></script ...
- 创建dynamics CRM client-side (十三) - 在HTML Web Resource中获取form elements & 获取外部js文件
上一节我们讨论到创建HTML Web Resource. 但是纯HTML的页面不能满足我们的需求, 所以今天我们来做在HTML Web Resource中获取form elements Please ...
- 【html】【2】html引入外部文件js css
1>引入js 我们只是写了简单必须的html标签,从未给标签添加点击事件,这次页面添加事件. >写入html页面,可以在<head>标签内 也可以在<body>标 ...
- ASP.NET中母版页引用外部js或css文件无效,提示对象未定义解决方法
最近做网站用了一个js+css实现的带有二级菜单的导航条,在母版页创建好后,子页面调用出现了许多奇怪的问题,多方查证后的最终解决方案和大家分享下.... 1.路径问题 如果是一个单独的aspx页面调用 ...
- 使用js加载器动态加载外部js、css文件
let MiniSite = new Object(); /** * 判断浏览器 */ MiniSite.Browser = { ie: /msie/.test(window.navigator.us ...
随机推荐
- ltp-ddt eth iperf
ETH_S_PERF_IPERF_TCP_8K_1448B source 'common.sh'; run_iperf.sh -m -M 1500 -f M -d -t 60 -w 8K run_ip ...
- 去掉Tomcat网站地址栏的小猫图标
当我们打开CSDN等网站时,在地址栏前面就会出现红色的C状图标,如果在桌面新建此链接的快捷方式,则桌面图标也自动变为该地址栏ICO图标.在基于TOMCAT的BS应用或网站开发时,默认的图标为黄色的小猫 ...
- 在子组件中触发事件,传值给父组件-vue
1.通过$emit触发事件 在子组件<x-test>中触发事件: <button @click="toSearchProduct()">搜索</but ...
- windows 10 删除资源管理器导航栏 Creative Cloud Files
安装完Adobe的Photoshop.After Effects等软件后,资源管理器导航栏会出现让人讨厌的Creative Cloud Files目录,稍微修改注册表即可删除. 快捷键Windows ...
- html中的点击事件
使用点击事件写一个计数器. onmouseup : 当鼠标按下,松开的时候触发事件. onmousedown: 当鼠标按下的时候触发事件.onMouseOver: 鼠标经过时触发 onMouseOut ...
- PCA(基础知识)
参考:http://blog.csdn.net/wangjian1204/article/details/50642732 参考:https://www.zhihu.com/question/3831 ...
- Python3解leetcode Number of Boomerangs
问题描述: Given n points in the plane that are all pairwise distinct, a "boomerang" is a tuple ...
- Linux内核设计与实现 总结笔记(第三章)进程
进程管理 进程:处于执行期的程序. 线程:在进程中活动的对象 虚拟机制 虚拟处理器:多个进程分享一个处理器 虚拟内存:多个线程共享虚拟内存 一.进程描述符和任务结构 进程存放在双向循环链表中(队列), ...
- BZOJ 2286: [Sdoi2011]消耗战 虚树
Description 在一场战争中,战场由n个岛屿和n-1个桥梁组成,保证每两个岛屿间有且仅有一条路径可达.现在,我军已经侦查到敌军的总部在编号为1的岛屿,而且他们已经没有足够多的能源维系战斗,我军 ...
- 【CF1253A】Single Push【模拟】
题意:给你两个数组a,b,求是否存在操作使得a变成b,操作为选取一段子区间[l,r],选一个正整数k,使得ai+=k,i∈[l,r],只能操作一次 题解:模拟即可 #include<iostre ...