关于背景图片url路径:图片和调用文件在两个不同根下的(不在同一个包(文件夹)中),要用相对路径,举例"../images/cq.gif";图片和调用文件是在一个根下的直接孩子,用相对于当前目录的绝对路径,举例"images/cq.gif",用错了显示不出图片。

css有三种创建方法:

外部样式表:单独的.css文件,调用时需要在页面head头部添加<link rel="stylesheet" type="text/css" href="mystyle.css" />,注意:不要在属性值与单位之间留有空格。假如你使用 “margin-left: 20 px” 而不是 “margin-left: 20px” ,仅在 IE 6 中有效,但是在 Mozilla/Firefox 或 Netscape 中却无法正常工作。

内部样式表:使用 <style>.... </style>标签在文档head头部定义内部样式表。

内联样式:慎用这种方法,在相关的标签内使用样式(style)属性。Style 属性可以包含任何 CSS 属性。

多重样式:内部可继承外部,重复的以内部的为准。

css之图片路径的更多相关文章

  1. MVC中用 BundleCollection 压缩CSS时图片路径问题

    MVC中有个专门提供JS和CSS压缩的类,BundleCollection,其实这个类也可以在asp.net中用, 关于BundleCollection类的详细推荐个地址:http://www.cnb ...

  2. webpack4 前端框架基础配置实例-解决css分离图片路径问题

    1.安装nodejs 2. 需要全局和项目安装webpack和webpack-dev-server npm install webpack webpack-dev-server -g npm inst ...

  3. css 背景图片路径问题

    背景图片路径找寻失败问题 1.加~ background-image: url("~@/assets/login/login-bg.png"); background-size: ...

  4. vue.js 独立引用css文件图片路径错误

    vue的环境是用vue-cli,写在vue文件的图片引用build之后的路径都没什么问题 但是有的时候我们会有一些公共的css文件单独的放在assets目录下 如下图所示 这里当build后发现写在c ...

  5. URLRewrite出现的CSS及图片路径问题

    原文发布时间为:2011-02-24 -- 来源于本人的百度文章 [由搬家工具导入] 例如:把http://www.sofunz.com/house/18649重写到http://www.sofunz ...

  6. 透过现象看webpack处理css文件中图片路径转换的具体过程

    webpack是目前使用比较流行的一个前端模块打包器,前端的任何资源都被当成一个模块来处理,如图片.css文件等等.在基于webpack构建的前端项目中,一般都会配置有关css文件处理的规则,这其中也 ...

  7. vue webpack 打包后css背景图路径问题

    最近在写vue-webpack项目时,打包后遇到了css背景图片路径报错的问题 奇怪的是,通过img标签引入的图片路径却没有问题,看来是webpack在打包后,读取css中图片的相对路径出错了. 稍微 ...

  8. Spring MVC程序中得到静态资源文件css,js,图片文件的路径问题总结

    上一篇 | 下一篇 Spring MVC程序中得到静态资源文件css,js,图片 文件的路径 问题总结 作者:轻舞肥羊 日期:2012-11-26 http://www.blogjava.net/fi ...

  9. (9/24) 图片跳坑大战--css分离与图片路径处理

    前言: 在上一节当中,我们把小图片打包成Base64格式(打包到了js当中).我们也算是对webpack对图片的打包有个基本了解. 本节我们准备把css从JavasScript代码中分离出来,这会遇到 ...

随机推荐

  1. Android 中shape的使用(圆角矩形)

    一.在res/drawable文件夹下创建一个名为gradient_box的xml文件: <?xml version="1.0" encoding="utf-8&q ...

  2. js鼠标滚轮事件

    不多说,直接上代码. //非ie document.body.onmousewheel = function(event) { event = event || window.event; conso ...

  3. mysql高可用架构之mysql-mmm配置详解

    实验系统:CentOS 6.6_x86_64 实验前提:防火墙和selinux都关闭 实验说明:本实验共有5台主机,IP分配如拓扑 实验软件:mariadb-10.0.20 mysql-mmm-2.2 ...

  4. github的使用(概要版)

    Github的世界 什么是github Github除提供Git仓库托管服务外,还为开发者或团队提供了一系列功能,帮助其高效率,高品质地进行代码编写. 使用github带来哪些变化 写作形式的变化 在 ...

  5. Android APP 读取 AndroidManifest.xml 中的版本信息详解

    APP都会涉及到版本的问题,Android APP的版本信息保存在AndroidManifest.xml文件的顶部.如下图: 有2个属性表示,“android:versionCode”和“androi ...

  6. JS实现类似QQ好友头像hover时显示资料卡的效果

    一.应用场景 鼠标hover弹出div,并且鼠标离开后不能马上隐藏,因为这个div上还有功能入口.比如: 鼠标经过好友列表中的好友头像时显示资料卡的效果 hover时显示二维码 二.实现 用如下这样一 ...

  7. 第3章 Linux常用命令(3)_文件搜索命令

    3. 文件搜索命令 3.1 文件搜索:find (1)find命令 命令名称 find 命令所在路径 /bin/find 执行权限 所有用户 语法 find [搜索范围] [-选项] [匹配条件] - ...

  8. SQLMAP参数介绍

    转自:http://zhan.renren.com/bugpower?gid=3602888498044629629&checked=true SQLMAP参数介绍 sqlmap的使用方式:p ...

  9. UCenter创始人密码正确但是登录不了

    UCenter创始人密码正确但是登录不了,没有什么提示,就反复输入密码登录 也进不了......... ================================================ ...

  10. LeetCode:Multiply Strings

    题目链接 Given two numbers represented as strings, return multiplication of the numbers as a string. Not ...