4

H1 タグ内のテキストを非表示にする必要があります。しかし、イメージではありません。問題は、html ではなく css のみを変更できることです。

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

CSSのみで「ヘッダー1テキスト」のみを非表示にする方法はありますか? 私は大規模なクライアントに対してこれを行っていますが、css ファイルへのアクセスしか許可されませんでした。

4

7 に答える 7

8

フォントサイズを 0px にする

​h1{ font-size:0px }​

編集：作業サンプル

于 2012-10-13T13:12:32.757 に答える
5

画像を の背景として設定し、<h1>CSS プロパティを に追加して画像のサイズにし、見出しに<h1>ネガを使用してテキストを削除します。text-indenthtml にもアクセスできる場合は、これが通常の理想的な方法です。

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 のみにアクセスできる場合は、次の URL にアクセスし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

font-size を 0px に設定するのと同じくらい簡単です

h1 {
   font-size: 0.1px;
}

http://jsfiddle.net/m5V2A/

于 2012-10-13T13:17:34.227 に答える