有关background 背景图片不能显示

2024-06-20 00:58

本文主要是介绍有关background 背景图片不能显示,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

首先有两个概念

绝对路径,从根目录为起点到你所在的目录;
相对路径,从一个目录为起点到你所在的目录。

例如:
             ┍ A文件夹
          C -|
             ┕ B文件夹

绝对路径: C:\A文件夹

相对路径(如果你在B文件夹时): ..\B文件夹  (‘..\’向上一级意思)

在实际操作过程中,相对地址和css是内联还是外联有关系的,这个问题在使用绝对地址时不存在。

内联时:{background-image: url(images/new_8.gif);}

外联时:{background-image: url(../images/new_8.gif);}

 

通常习惯用绝对路径

background 

当给背景图片设置宽高的时候  用绝对路径(有问题)

当没有设置宽高的时候 一定要用相对路径

在CSS文件中设置background的url的值,相对地址应该是图片相对于你当前CSS文件所在的路径

url相对地址应是背景图像相对于css所在文件的地址!当使用内联css时,相对地址为图像相对于htm文件的地址;当使用外联css时,相对地址应为图像相对于css文件的地址!        

这篇关于有关background 背景图片不能显示的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/1076647

相关文章

JAVA读取MongoDB中的二进制图片并显示在页面上

1:Jsp页面: <td><img src="${ctx}/mongoImg/show"></td> 2:xml配置: <?xml version="1.0" encoding="UTF-8"?><beans xmlns="http://www.springframework.org/schema/beans"xmlns:xsi="http://www.w3.org/2001

据阿谱尔APO Research调研显示,2023年全球髓内钉市场销售额约为4.7亿美元

根据阿谱尔 (APO Research)的统计及预测,2023年全球髓内钉市场销售额约为4.7亿美元,预计在2024-2030年预测期内将以超过3.82%的CAGR(年复合增长率)增长。 髓内钉市场是指涉及髓内钉制造、分销和销售的行业。髓内钉是一种用于整形外科手术的医疗器械,用于稳定长骨骨折,特别是股骨、胫骨和肱骨。髓内钉通常由不銹钢或钛等材料制成,并插入骨的髓管中,以在愈合过程中提供结构支

background-position切图

老生常谈,网上也很多,但是还是记下。 .overview-user-icon {background-image: url('../../../../static/imgs/overview-201811161524.svg');width: 24px;height: 24px;display: inline-block;background-size: 475% 458.3333333333

vue+elementUI下拉框联动显示

<el-row><el-col :span="12"><el-form-item label="主账号:" prop="partyAccountId" :rules="[ { required: true, message: '主账号不能为空'}]"><el-select v-model="detailForm.partyAccountId" filterable placeholder="

python 在pycharm下能导入外面的模块,到terminal下就不能导入

项目结构如下,在ic2ctw.py 中导入util,在pycharm下不报错,但是到terminal下运行报错  File "deal_data/ic2ctw.py", line 3, in <module>     import util 解决方案: 暂时方案:在终端下:export PYTHONPATH=/Users/fujingling/PycharmProjects/PSENe

温湿度采集及OLED显示

目录 软件I2C和硬件I2C每隔2秒钟采集一次温湿度数据,显示到OLED上,同时通过串口发送到上位机的“串口助手”软件 软件I2C和硬件I2C "I2C"代表Inter-Integrated Circuit,是一种用于在数字电路之间进行通信的串行通信协议。软件I2C和硬件I2C是两种实现这种协议的方式。 软件I2C是通过软件来模拟I2C通信协议的实现方式。在这种情况下,微控制

Linux之时间显示

在linux中使用使用date的方式来显示时间,但是如果想按照自己想要的格式展示,那就需要加上一点参数了 显示当前时间 date 2024年 06月 23日 星期日 23:21:42 CST 显示当前年份 date +%Y 2024 显示当前月份 date +%m 6 显示当前日期 date +%d 23 自定义显示格式 date "+%Y-%m-%d

【QML】用 Image(QQuickPaintedItem) 显示图片

大体功能: 频繁地往界面推送图片,帧率达到视频效果。捕获画布上的鼠标事件和键盘事件。 代码如下: // DrawImageInQQuickPaintedItem.pro 代码如下:QT += quick# You can make your code fail to compile if it uses deprecated APIs.# In order to do so, uncom

卧槽,6。套死你猴子,Tomcat访问html页面显示源码?

卧槽,6。Tomcat访问html页面显示源码? 元凶text/explain //踩坑!!!不能用 servletResponse.setContentType("text/explain,否则访问html会看到源码,而不是渲染页面; charset=UTF-8");servletResponse.setContentType("text/html; charset=UTF-8");

加载网络图片显示大图

1.将图片的uri列表和下标传给ImagePagerActivity public void imageBrower(int position, ArrayList<String> urls2) {Intent intent = new Intent(this, ImagePagerActivity.class); intent.putExtra(ImagePagerActivity