相关疑难解决方法(0)

我div有一套display:block.(90px height和width)我里面有一些文字.

我需要文本在垂直和水平方向上对齐.

我试过了text-align:center,但它不做水平部分,所以我试过vertical-align:middle但它没有用.

有任何想法吗？

是否有一种简单的方法来显示灰度的彩色位图HTML/CSS？

它不需要与IE兼容(我想它不会) - 如果它在FF3和/或Sf3中工作,这对我来说已经足够了.

我知道我可以用SVGCanvas和Canvas 来做这件事,但现在看起来好像很多工作.

有一个真正懒惰的人这样做的方法吗？

我想降低CSS中的图像亮度.我搜索了很多,但我所拥有的只是如何改变不透明度,但这使图像更加明亮.谁能帮我 ？

我用这段代码模糊了一些图像

img {
  filter: blur(5px);
  -webkit-filter: blur(5px);
  -moz-filter: blur(5px);
  -o-filter: blur(5px);
  -ms-filter: blur(5px);
}

然而,图像的边缘也变得模糊.是否可以模糊图像,同时保持边缘定义？像插图模糊或什么？

关于我的图像,我有一个小问题,如此处所示(http://jsfiddle.net/garethweaver/Y4Buy/1/).

.img-blur:hover {
  -webkit-filter: blur(4px);
  transition: all 0.35s ease-in-out;
  -moz-transition: all 0.35s ease-in-out;
  -webkit-transition: all 0.35s ease-in-out;
  -o-transition: all 0.35s ease-in-out;
  -ms-transition: all 0.35s ease-in-out;
}

<img src="http://i.imgur.com/Vp5StNs.png" class="img-blur">

当鼠标悬停时图像会模糊,但当我将鼠标移开时它会直接恢复正常,我怎样才能让它从模糊中消失？

还有,鼠标悬停时有没有办法显示文字？当用户将鼠标悬停在图像上时,我希望它模糊,然后显示一些文本,例如"了解更多".只有css这也可能吗？

干杯

我有一个像这样的简单图像：

<img src="/assets/missing.png">

现在我想要的是能够将鼠标悬停在图像上并出现一个透明的黑色覆盖层，上面有一个大的“x”。是否可以仅使用 CSS3 还是我需要 Javascript？如果是这样怎么办？

我有点让它工作，但我有一个我似乎无法解决的问题。这是一个屏幕截图：

截屏

如您所见，顶部缺少一个部分。这是我的CSS：

.image {
  padding: 0px;
  display: inline-block;
  vertical-align: middle;
  max-height: 150px;
  max-width: 150px;
  margin: 15px;
  position:relative;
}

.image img {
  width:100%;
  vertical-align:top;
}

.image:after {
  content:'\A';
  position:absolute;
  width:100%; height:100%;
  top:0; left:0;
  background:rgba(0,0,0,0.6);
  opacity:0;
  transition: all 0.5s;
  -webkit-transition: all 0.5s;
}

.image:hover:after {
  opacity:1;
}

我想用css实现如下图所示的图像。我的意思是我想让图像背景出现，但在前面的图像应该是透明的。我的意思是它应该像模糊一样被覆盖。我想实现如下图所示。

img {
  -webkit-filter: blur(5px);
-moz-filter: blur(5px);
-o-filter: blur(5px);
-ms-filter: blur(5px);
filter: blur(5px);
position:fixed;
}

<div><img src="http://i.imgur.com/v06GqMK.jpg" /></div>

我在页面上有一个图像和一个带有信息文本代码笔示例的div .

<div>
  <img src="http://placehold.it/400x200"/>
  <div class="info">
    <a href="#">GO</a>
    <span>Title</span>    
    <p>Some information text</p>
  </div>
</div>

我希望div信息不可见,当我将鼠标移到图像上时,div将显示在图像上,具有透明度,并且图像的宽度和高度完全相同.

而且我希望div信息中的锚点位于右上角.我怎样才能做到这一点？

例如，在下图中，对实际照片没有进行任何更改，只是添加了黑色叠加层。

我如何使用 css 来做到这一点？或者我如何使用任何其他软件来做到这一点？