html - 使用 CSS 替换图片 src 位置

标签 html css image

我有一个网站有一个带有 src 属性的图像,我想用我自己的图像更改该图像的 src 位置。图像存在于 div 组件中。我无法更改 HTML,正在寻找仅使用 CSS 更改它的方法。

Div 组件:

<div class="application-title">
<img style="margin-top: 3px;height: 45px;" src="image.svgz">
</div>

图片组件(CSS文件):

.application-title IMG
{
    float: left;
    margin-top: 5px;
    margin-right: 10px;
    opacity: 1;
    margin-left: 0px;
    visibility: hidden;
}

最佳答案

你可以使用背景图片

.application-title img {
  width:200px;
  height:200px;
  box-sizing:border-box;
  padding-left: 200px;
  /*width of the image*/
  background: url(http://lorempixel.com/200/200/city/2) left top no-repeat;
}
<div class="application-title">
  <img src="http://lorempixel.com/200/200/city/1/">
</div><br />
Original Image: <br />

<img src="http://lorempixel.com/200/200/city/1/">

关于html - 使用 CSS 替换图片 src 位置,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28832129/

相关文章:

html - 如何在任何在线页面上本地应用 CSS?

ios - 如何为图像和消息创建条件?

image - Canvas drawimage() 黑色结果

image - 在 Meteor 中使用 Router 渲染模板后无法加载图像

html - 如何为每个 li 元素添加一个具有元素数量的类?

javascript - 多次使用一个组件时如何一次触发或检测所有组件 - Ember

asp.net-mvc - 无法让渐变延伸到浏览器底部

html - 我的 .css 文件在我的网页上不起作用

javascript - 将值从 javascript 传递到 html 和 codeigniter

javascript - 单击图像上复制图像位置