我有一个标签在我的html像这样:
<h1>My Website Title Here</h1>
使用css我想替换文字与我的实际标志。我已经得到的标志没有问题,通过调整标签和把背景图像通过css。然而,我不知道如何去掉这段文字。我以前见过,基本上就是把文字从屏幕上推开。问题是我不记得在哪里看到的。
我有一个标签在我的html像这样:
<h1>My Website Title Here</h1>
使用css我想替换文字与我的实际标志。我已经得到的标志没有问题,通过调整标签和把背景图像通过css。然而,我不知道如何去掉这段文字。我以前见过,基本上就是把文字从屏幕上推开。问题是我不记得在哪里看到的。
当前回答
h1{
background:url("../images/logo.png") no-repeat;
height:180px;
width:200px;
display:inline-block;
font-size:0px !important;
text-intent:-9999999px !important;
color:transparent !important;
}
其他回答
你可以通过添加这个属性来隐藏你的文本:
font-size: 0 !important;
你可以使用CSS的background-image属性和z-index来确保图像保持在文本的前面。
最好的答案适用于短文本,但如果文本换行,它只会显示在图像中。
一种方法是用jquery处理程序捕获错误。尝试加载一个图像,如果失败,它会抛出一个错误。
$('#logo img').error(function(){
$('#logo').html('<h1>My Website Title Here</h1>');
});
参见SAMPLE CODE
有这么多复杂的解决方案。
最简单的使用方法是:
color:rgba(0,0,0,0)
这对我来说适用于span(敲除验证)。
<span class="validationMessage">This field is required.</span>
.validationMessage {
background-image: url('images/exclamation.png');
background-repeat: no-repeat;
margin-left: 5px;
width: 16px;
height: 16px;
vertical-align: top;
/* Hide the text. */
display: inline-block;
overflow: hidden;
font-size: 0px;
}