4

我需要将文本隐藏在 H1 标签内。但不是图像。问题是我只能更改css而不是html

<h1>
<img src="img/headerimg.png" width="900" height="125"/>
Header 1 text
</h1>

有没有办法只用css隐藏“Header 1 text”？我正在为大客户做这件事，他们只给了我对 css 文件的访问权限。

4

7 回答 7

8

给一个 0px 的字体大小

​h1{ font-size:0px }​

编辑：工作样本

于 2012-10-13T13:12:32.757 回答
5

将图像设置为背景<h1>，添加 CSS 属性使其与图像大小相同，并在标题上<h1>使用负号来删除文本。text-indent如果您也可以访问 html，那将是通常和理想的方式。

由于您只能访问 CSS，因此可以使用：

h1 {
    font-size: 0.1px; /* 0 gets disregarded by Internet Explorer, 0.1 gets interpreted right by every browser */
}

小提琴：http: //jsfiddle.net/VGgnD/

于 2012-10-13T13:10:32.533 回答
3

您可以使用 CSS 执行此操作：

<h1>
    <img src="img/headerimg.png" width="900" height="125"/>
    Header 1 text
</h1>

CSS：

h1 {
    width: 900px;
    height: 125px;
    background: url("img/headerimg.png") no-repeat center center;
    text-indent: -99em;
}

如果您只能访问 CSS，display: none;请img：

h1 img {display: none;}

工作小提琴：http: //jsfiddle.net/sJ8JD/

于 2012-10-13T13:10:52.090 回答
1

好吧，我唯一想到的是：

<h1 style="color: transparent; font-size: 0px; text-indent: -99em;">
<img src="http://pokit.org/get/img/18d5148ef77ef2a2d5d8193c1c8789e8.jpg" width="900" height="125"/>
Header 1 text
</h1>

工作示例：

http://jsfiddle.net/VRQVs/2/

于 2012-10-13T13:12:51.260 回答
0

设置font-size: 1px !important;和设置背景颜色为文本颜色

于 2012-10-13T13:10:55.447 回答
0

您可以尝试position:absolute;使文本不可见，它将位于页面之外。-5000px

h1 {
  margin-top:-5000px;
  position:absolute;
}
h1 img {
  position:absolute;
  margin-top:5000px;
}

例子

于 2012-10-13T13:13:11.337 回答
0

它可以像将字体大小设置为 0px 一样简单

h1 {
   font-size: 0.1px;
}

http://jsfiddle.net/m5V2A/

于 2012-10-13T13:17:34.227 回答