css中url的路径含义及使用
http://www.jb51.net/css/37554.html
在CSS中有用url语法来指定background-image或是其他引用文件中,如:
代码如下:
height:52px;
background-image:url(../images/mainheader_top_bj.gif);
background-repeat: repeat-x;
background-position: top;
}
1.background-image一类:
实际应用时,经常把css写入样式文件中,并放入专门的目录,把图片放入专门图片目录中,而实际使用的aspx文件在另一个目录,假设有这样一个实际应用目录:
----root
----images
--mainheader_top_bj.gif
----css
--a1.css
----ff.aspx
其中,ff.aspx引用到a1.css,而a1.css中有.mainheader,如文章开头那样的url定义,想使用images中的mainheader_top_bj.gif的图片.
这个url的路径应该以ff.aspx为准,还是以a1.css为准?
经测试,发现该路径以a1.css(也即CSS文件)为准,不论是HTML文件使用还是在asp.net网站中,都是如此.
2.behavior一类
IE使用的 behavior: url(xxx/xxxxx.htc)来做HTML组件,这时,url里指定的htc文件路径,则是相对HTML所在的目录来的了,如下目录:
----root
----images
--mainheader_top_bj.gif
--iepngfix.htc
----css
--a1.css
----pub1
--frm1.aspx
----ff.aspx
则ff.aspx使用的a1.css文件中要指定behavior,则要如下:
代码如下:
当然,这个用法就比较死板了,这样一来,这个css文件就只能root目录下的aspx和html文件使用了,如果pub1目录下的frm1.aspx想用这个css,那上面的那个htc目录就不对了,而应该变为:
代码如下:
当然,这样用,还不如直接在每个aspx文件里指定这个htc,而不是把这个htc式子放入css中;如果能定下网站的相对根(/)的相对路径,也可以写成(假设iepngfix.htc固定放在网站根下的/images目录中):
代码如下:
css中url的路径含义及使用的更多相关文章
- JS、CSS中的相对路径
css中url(../images/1.jpg)路径是相对于index.css的 js中url(images/1.jpg)路径是相对于index.html的,并不是相对于index.js
- CSS中的图片路径问题
CSS中的背景图片写了相对路径,为什么不显示那? [解决方法] CSS中的背景图片路径应该写成相对于当前CSS文件的路径,而不是针对网站根目录的相对路径.
- css cursor url用法格式详解
css cursor url用法格式:css:{cursor:url('图标路径'),auto;} //IE,FF,chrome浏览器都可以 实例代码:html{cursor: url("h ...
- css Cursor:url()自定义鼠标指针样式为图片
css自定义鼠标指针样式为图片Cursor:url()的使用,今天在项目中,要用到自定义鼠标样式,格式: css:{cursor:url('绝对路径的图片(格式:cur,ico)'),-moz-zoo ...
- jsp、css中引入外部资源相对路径的问题
在jsp页面中添加base,可用相对路径: <% String path = request.getContextPath(); String basePath = request.getSch ...
- webpack中,css中打包背景图,路径报错
css-loader: //打包样式中背景图 { test: /\.(png|jpg)$/, loader: "url-loader?limit=8192&name=images/[ ...
- CSS与JS中的相对路径引用
javascript和css文件中采用相对路径,其基准路径是完全不同的. 1.javascript引用资源(比如图片)相对路径是以宿主路径(被引用的网页比如你在首页index.php引用了某js文件, ...
- Css中路径data:image/png;base64的用法详解
今天查看一些网站的css中发现了 background-image:url(data:image/png;base64, iVBORw0KGgoAAAANSUhEUgAAAAEAAAAkCAYAAAB ...
- web中的CSS、Xpath等路径定位方法学习
今天不到八点就到公司了,来的比较早,趁着有点时间,总结下web中的CSS.Xpath等路径定位定位的方式吧! 简单的介绍下xpath和css的定位 理论知识就不罗列了 还是利用博客园的首页.直接附上代 ...
随机推荐
- Codeforces Round #356 (Div. 2) E. Bear and Square Grid 滑块
E. Bear and Square Grid 题目连接: http://www.codeforces.com/contest/680/problem/E Description You have a ...
- PHP获取数组中奇偶数
获取PHP数组中的奇偶数,可通过数组过滤函数array_filter(),看定义:该函数把输入数组中的每个键值传给回调函数.如果回调函数返回 true,则把输入数组中的当前键值返回结果数组中.数组键名 ...
- SPOJ 10628. Count on a tree (树上第k大,LCA+主席树)
10628. Count on a tree Problem code: COT You are given a tree with N nodes.The tree nodes are number ...
- Android - Mount a Samba share
Mount Manager, Cifs manager :Manage your CIFS/NFS network shares was working, but the command from t ...
- systemtap 用户态调试3
[root@localhost ~]# cat test.c #include <stdio.h> int main( void) { int a=0; a=fun(10,20); pri ...
- linux下面mmap和setsignal函数用法
#include <stdio.h> #include <stdlib.h> #include <sys/mman.h> #include <fcntl.h& ...
- 细说Unity3D(一)——移动平台动态读取外部文件全解析
前言: 一直有个想法,就是把工作中遇到的坑通过自己的深挖总结成一套相同问题的解决方案供各位同行拍砖探讨.眼瞅着2015年第一个工作日就要来到了,小匹夫也休息的差不多了,寻思着也该写点东西活动活动大脑和 ...
- Jetty学习二:配置概览-怎么配置Jetty
Jetty POJO配置 Jetty的核心组件是Plain Old Java Objects(POJOs):配置Jetty的大部分工作就是在Jetty POJOs上的初始化.装配和设置域的处理,你能通 ...
- 【BZOJ】【3239】Discrete Logging
BSGS BSGS裸题,嗯题目中也有提示:求a^m (mod p)的逆元可用快速幂,即 pow(a,P-m-1,P) * (a^m) = 1 (mod p) /******************** ...
- 用wubi安装的Ubuntu在重装Windows 7系统后,如何恢复(转)
原文链接:双系统Win7+Ubuntu,重装Win7后找不到Ubuntu启动引导项问题 1.把安装ubuntu->winboot文件夹下wubidr和wubidr.mbr两个文件拷到C盘根目录下 ...