如何用纯CSS和HTML覆盖图像/水印

文章/答案/技术大牛

发布

3回答

html、css、image、overlay、watermark

有没有一种相对定位的简单方法，只需传递一个类，就可以将透明的PNG (或任何其他图像)覆盖在使用CSS的图像标签上？<img class="watermarked" src="http://placehold.it/500x325.jpg" alt="Photo">.watermarkedplacehold.it/100x100/09f

浏览 13提问于2018-01-21得票数 4

回答已采纳

1回答

在Python中获取图像中水印的掩码

python、numpy、opencv、watermark、edge-detection

给定一系列带水印的照片，我想要分离水印，并生成一个掩模。我使用的是Python和numpy。水印在此组合中清晰可见。对于人类来说，这很容易追踪。我想要的结果是一个白色的图像，水印的形状填充为黑色。因此，如果我用蒙版覆盖其中一个带水印的图像，水印将被完全覆盖。我已经尝试在合成图像上使用边缘检测和阈值。但是我还没能找到一种通过编程来隔离水印内容的

浏览 36提问于2021-05-06得票数 2

4回答

如何让元素具有不同的背景颜色，而背景图像却到处显示(也就是水印)？

html、css、watermark

我想创建一个带水印的html页面。我在身体上设置了背景图像。然而，我有一些元素不允许背景图像渗出。它们定义自己的背景颜色(但不是背景图像)，覆盖主体中的颜色。这让我很惊讶。他们没有覆盖图像，只覆盖了颜色。如何使用标准的html/css获得我想要的效果？下面是一些示例代码，说明了这个问题。请注意，白色块模糊了我

浏览 0提问于2009-02-26得票数 1

回答已采纳

1回答

我能用php在地图上做一个可移动的物体吗？

php

基本上是一个背景图像与另一个小图像覆盖，这是基于坐标的移动。每次用户单击N、E、S或W时，页面都会刷新。我想我完全可以不用图像就可以用if语句来做。

浏览 1提问于2013-09-04得票数 1

回答已采纳

1回答

使用SVG或CSS为网页上的图像添加“水印”或覆盖

css、svg

如何在网页上显示的图像上添加CSS或SVG覆盖或水印？我有一个缩略图的网格，我正在显示，并想突出他们中的一些与特殊的注释或文字。 HTML5和CSS3，但需要适当地降级。JQuery也是可以接受的。

浏览 2提问于2013-07-19得票数 3

回答已采纳

2回答

如何创建没有图片的文本水印？

css

创建根据请求的页面内容显示文本的水印需要什么css？我正在使用Drupal生成页面内容。这里的目的是用相关内容来增强页面的图形化效果。因此，除了标题和页面的主体，我希望有几个相关的关键字显示为一个半透明的背景下的页面内容和以上的背景图像。背景图像和水印文本对于不同类别的信息都会有所不同。

浏览 0提问于2011-11-27得票数 3

回答已采纳

2回答

是否将“图像另存为”链接到不同的图像？

php、javascript、html

我正在尝试使用水印保护图像，但我不想在网站上显示带有水印的图像。我创建了一个php脚本，可以动态地为图像添加水印，但下面是我想要做的事情：谢谢!

浏览 5提问于2012-06-26得票数 1

0回答

HTML和CSS是否可以自动创建忽略图像上透明区域的覆盖？

html、css

例如，它有一个具有透明背景的图像：我想添加一个灰色的覆盖(例如，div或canvas...)在它上面：但我希望覆盖图自动忽略图像上的透明区域：可以纯HTML和CSS

浏览 5提问于2016-12-16得票数 23

11回答

消除科尔之间的间隔

css、twitter-bootstrap

我们如何用纯CSS覆盖Bootstrap的CSS以完成此任务或任何其他更好的解决方案？main.html <div class="col-md-2"> </div> <div

浏览 8提问于2016-10-26得票数 47

回答已采纳

2回答

如何将彩色封面放置在CSS图像的顶部

css、hover

我想能够覆盖一个蓝色的图像，当我悬停在上面。我如何用纯CSS实现这一点？

浏览 1提问于2014-02-10得票数 0

回答已采纳

3回答

我怎样才能像9gag那样给图像添加水印呢？

html、css、xhtml

我需要开始在我的图片上添加水印，因为我开始注意到人们正在使用它们。我真的不喜欢在一张图片上到处都是水印。我更喜欢9gag这样做：没有任何可见的水印，但是当您右键单击并保存图像时，您可以看到水印。

浏览 3提问于2012-10-09得票数 2

3回答

MVC框架中的WaterMark TextBox

asp.net-mvc、asp.net-mvc-3、asp.net-mvc-2

如何在HTML文本框上创建水印？这是一个MVC3 web应用程序。

浏览 1提问于2011-11-10得票数 1

5回答

如何使用纯CSS在具有相对大小的div元素中对未知大小的图像进行拟合和居中

html、css、responsive-design、alignment

我正在做一个CSS动画HTML块。我创建了一个完全负责的网格，因此这些块具有相对大小的。该块包含一个大图像，以确保在所有屏幕上正确显示内容。块中的图像具有100%宽度的以适应内容，它们还具有CSS转换和转换。我希望这些图像垂直居中，但只使用纯CSS。我尝试了许多display、position和vertical-align属性的变体，但没有人为我工作。我可以很容易地使用background属性实现适当的动画，但我不

浏览 4提问于2013-09-15得票数 3

1回答

适合没有定义父高度的图像

html、css、image-resizing

我负责制作的网站有一个水印，为了我自己的理智，我把它编码为一个单独的对象，而不是背景。(对于记录，即使当更改为每个父元素的背景时，此问题仍然存在。)我必须将html和body元素的高度设置为auto，这样它们才能捕获子元素，但现在水印卡住了，覆盖了我的显示器一次可以显示的页面的任何百分比。设置为auto时，图像会最大化，但仍然不会一直延伸到底部。以下是影响图像的HTML：<body> <

浏览 5提问于2018-08-08得票数 1

2回答

元素边框将具有透明的角。

css

我需要创建一个按钮或元素，它的边框与透明的角(如示例图像中的角)相同。我没有找到这方面的任何css，我正在考虑将4个:after元素覆盖元素的角落。对于这一点，您有任何纯css或jquery解决方案吗？

浏览 5提问于2014-08-07得票数 0

回答已采纳

5回答

图表的语义表示

html、css、semantic-markup

我正在重新编码一个旧站点，其中包含一个类似于以下内容的图表：欢迎任何建议。

浏览 0提问于2008-11-25得票数 3

回答已采纳

3回答

IE 11中未显示前景水印

css、internet-explorer

下面的CSS可以在FF，Chrome，Edge等大多数浏览器上使用，但在IE 11中不能使用。有人能帮我吗？下面是我正在使用的CSS：.watermarked { content: "";

浏览 1提问于2020-06-11得票数 0

4回答

用于批数字水印文件的无窗口程序

windows、gratis、image-processing、photography、digital-watermarking

我正在我的博客和Facebook上发布照片相册，我想给它们添加水印。我已经为Gimp等程序找到了教程，但它们需要对每个文件进行长时间的手动应用。是否有一个免费的Windows程序，可以同时向多个文件添加水印？

浏览 0提问于2014-02-04得票数 19

回答已采纳

1回答

允许用户为单个上传的图像选择所需的图像样式。

nodes、media

我有一个视图列表，以横向的方式显示一组属性的显示地址、图像、描述和价格，每一行都是一个新的属性列表。用户只需上传图像并单击“保存”。然而，我最近被要求允许用户再次上传一个图像，只是这一次选择一个图像样式，其中包含一个覆盖或水印图像之上的上传图像。我已经设法创建了一个水印效果的图像样式，他们要求的每一个重叠图像，如“现在可用”，“在提供”等。但我完全不知道如何为用

浏览 0提问于2012-03-22得票数 4

3回答

带有wicked-pdf的背景图像(水印)

css、ruby-on-rails、pdf、watermark、wicked-pdf

我需要使用一个图像作为水印的各种文件，我正在生成和转换为pdf与邪恶的-pdf。它花了一段时间，但我几乎所有的工作。我的show.pdf.erb是：<html> <style type="text/css"> <%= Rails.application.assets.find_asset('wicked.css

浏览 1提问于2014-05-12得票数 0

点击加载更多