`
- 浏览:
876895 次
-
-
在CSS文件里,有时要用到background,即加一个背景图片,一般在做按钮样式时会经常用到。<wbr></wbr>
-
css中加背景图片根据图片及css文件的相对位置分一下几种类型:<wbr></wbr>
-
1.同包下:background<wbr>:<wbr>url(aaa.gif);</wbr></wbr><wbr></wbr>
-
2.不同包:<wbr></wbr>
-
<wbr><wbr><wbr><wbr>在这种情况下有2中方法可以设置,一种是使用绝对路径,即http://www.iteye.com/aaa.gif这种,不过一般不推荐这么用,不利于项目移植;一种是使用相对路径,首先需要找到图片文件和css文件共同的一个根目录,然后再加上图片的子目录,比如:</wbr></wbr></wbr></wbr><wbr></wbr>
-
<wbr><wbr><wbr><wbr>css文件位置:WebRoot/test/css/a.css</wbr></wbr></wbr></wbr><wbr></wbr>
-
<wbr><wbr><wbr><wbr>图片文件位置:WebRoot/platform/resource/images/icons/a.gif</wbr></wbr></wbr></wbr><wbr></wbr>
-
想要找到共同的根目录就需要用到<wbr>"../"<wbr>这个路径的意思是上一级目录,如果是两层上级目录,就是<wbr>"../../"<wbr>那么,按照这种写法的话,a.css中得背景图片css应该这么写:</wbr></wbr></wbr></wbr><wbr></wbr>
-
<wbr><wbr><wbr><wbr>background:url(../../platform/resource/images/icons/a.gif)</wbr></wbr></wbr></wbr><wbr></wbr>
-
为什么呢?<wbr></wbr>
-
<wbr><wbr>首先,我们观察这两个文件的位置,可以发现,共同的根目录是WebRoot,</wbr></wbr><wbr></wbr>
-
我们首先在a.css的位置找到WebRoot,所以有了"../../"<wbr>然后拼接图片的子目录的路径<wbr>又有了"platform/resource/images/icons/a.gif"<wbr>合在一起后就是上面的结果了。</wbr></wbr></wbr>
分享到:
Global site tag (gtag.js) - Google Analytics
相关推荐
找到css中的路径并替换送找html中的css、js、图片的路径并替换
在css中,可以利用“background-size”属性设置背景图片自适应大小,该属性用于设置背景图片的大小,只需要给背景图片元素添加“background-size:cover;”样式,即可使背景图片的大小自适应。
在vue组件的style标签内部有如下一段使用背景图片的css代码 background-image: url("../assets/img/icon_add.png"); 在webpack中css-loader的解析配置如下 { test: /\.(css|less)$/, exclude: path.resolve(__...
css代码添加背景图片常用代码
解决:build->utils.js里,修改:增加 publicPath:'../../', if (options.extract) { ...以上这篇解决vuejs项目里css引用背景图片不能显示的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也
那么这篇文章将详细介绍了这几种背景图片的处理方法。 正如前面所说,仅仅依靠CSS现有的属性,我们无法实现背景裁切、背景透明度、背景变换和复杂背景定位等效果.为了实现这些效果,我们需要借助CSS的其他方法来实现...
css背景颜色透明背景图片切换效果
CSS样式图片下载助手,css背景图片下载 可以下载css里面定义的所有图片
css背景图片自适应
这是一款CSS3鼠标hover背景图片缩放动画效果。该特效是在鼠标hover背景图片时,将背景图片平滑放大。鼠标离开时,背景图片恢复为原来的大小。
CssSprite是一款很好用的小图合并工具,能自动生成CSS代码,导入小图就可以直接用了~
主要介绍了css控制背景示例,这里提供了css设置背景图片、设置背景颜色的方法,需要的朋友可以参考下
css全屏背景图片设置,django加载图片路径详解 XML/HTML Code复制内容到剪贴板 <head> <style type="text/css"> #bg { position:fixed; top:0; left:0; width:100%; height:100%;...
圆角按钮宽度自适应 自适应宽度的CSS圆角背景的按钮
今天小编就为大家分享一篇解决vue打包css文件中背景图片的路径问题,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
java Script 样式 CSS 希望对大家 有用 呵呵
简单的利用css设置背景和文字案例,有需要的可以下载学习
css背景色渐变
详细描述css背景属性。有案例进行支持,学习之后对css背景能很好的应用。
Css背景图合并工具,添加了几个辅助功能: 添加了用鼠标拖动图片或者用方向键改变图片位置的功能 可以设置整幅大图的生成类型,因为png文件在ie6下透明色显示有问题,所以朋友提出这个问题 可以设定大图的背景色,...