2011-01-26 11 views
6

をカバーする方法:のは、我々は次のようにdiv要素を持っていると言うのdiv

<div class="post">Variable text</div> 

テキストはもはやすることができます。したがって、3文字、150または300になります。 divの境界はborder: 1 px solid blackで、background: whiteです。 テキストを読むことができないようにこのdivを完全にカバーする別のdiv(位置はrelativeまたはabsoluteと思います)を作成する方法はありますか?

答えて

19
<div class="post" style="position:relative"> 
    Variable text 
    <div style="position:absolute;top:0;left:0;width:100%;height:100%;background-color:white"></div> 
</div> 

「黒」であることを確認し、あなたは、白いボックスが上にあることを確認するためにZ-インデックスで遊ぶ必要があるかもしれません。基本的に、その内側divは外側divの左上隅から始まり、それと同じサイズです。

+1

私はあなたを愛しています... – Shoe

1

達成しようとしていることは何ですか?別の部門が必要な理由は?

あなただけの理由はないあなただけのデータ隠蔽しようとしている場合:

<div class="post" style="background-color:black;">Variable text</div> 

そして、あなたのテキストはそのようなことは、仕事ができるも

+0

私のテキストは、内部の異なる色や画像などの色の 'span'を持っている可能性があるため。 – Shoe

+0

さて、でも、なぜ隠そうとしているのですか?あなたは、ユーザーは単にソースを見ることができることを認識していますか? –

+0

私は、ダイビングが終わった後、他のテキストを追加できるので、隠そうとしています。 – Shoe

0

私はあなたがこれをやろうとしている理由について100%明確ではありませんが、visibility:hiddenを使用してdivを完全に隠すことを検討したかどうか疑問に思いました。 CSSスタイル。

1

CSS:

.outer { 
    position:relative; 
    z-index:10; 
} 
.inner { 
    position:absolute; 
    left:0; 
    top:0; 
    width:100%; 
    height:100%; 
    z-index:20; 
} 

CSS(画像交換):

.outer { 
    text-indent:-9999em; 
    height:0; 
    padding:100px 0 0 0; 
    width:100px; 
    background-image:url(100x100.jpg); 
} 

HTML:

<div class="outer"> 
    <div class="inner"></div> 
    Text to Replace 
</div> 
関連する問題