1

HTML:

<div id="id1">
this is my text1.
</div>
<div id="id2">
this is my text2.
</div>

CSS:

<style>
#id1 {
    margin: 0 auto;
    width: 600px;
    background-color:#00FFCC;   
}
#id2 {
    margin: 0 auto;
    width: 600px;
    background-color:#FFCCCC;

}
</style>

前面には、次のように表示されます。

this is my text1. (green background)
this is my text2. (pink background)

今、次のように表示したい場合：

this is my text1.                                   this is my text2. (green background) 
empty in pink background

html コードを変更しない場合、css のみで実現することは可能ですか? 基本的に私がやりたいことは、 text:this is my text2.を最初の div: に移動することです:<div id="id1"></div>

4

6 に答える 6

5

CSS ではスタイルを変更できますが、コンテンツは変更できません: CSS では、div 間でテキストを移動することはできません。

そのためには、XSLT などの他のテクノロジを確認する必要があります。

于 2013-08-07T06:44:46.977 に答える
2

これがJSBinで、CSS の下に追加します。

#id1:after {
  content:'this is my text2'; 
  margin-right:0px;
  float:right;
  background-color:#FFCCCC;
}
于 2013-08-07T06:53:18.370 に答える
0

CSS は、html 要素のスタイルを設定する方法にすぎません。CSS を使用して要素のコンテンツを操作することはできません。表示方法のみを操作できます。この動作を「見せる」ことができる方法があるかもしれませんが、コンテンツは常に元の div に存在します。javascript を使用すると、はるかに簡単に実現できます。

于 2013-08-07T06:45:26.620 に答える
0

これから移動したい場合：

<div id="id1">
this is my text1.
</div>
<div id="id2">
this is my text2.
</div>

これに：

<div id="id1">
this is my text1.
this is my text2.
</div>
<div id="id2">
</div>

おそらくjavascriptを使用できますか？テキストをある div から別の div に移動して、ここで html を編集しているため、CSS だけでは可能ではないと思います。

ただし、ホバー イベントなどを使用して CSS の配置によって 2 番目の div を移動することもできます。しかし、それは見た目の変更にすぎませんが、テキストはまだ 2 番目の div にあります。

たとえば、次のよう になります。

HTML

<div id="id1">
this is my text1.
</div>
<div id="id2">
    <div class="text">this is my text2.</div>
</div>

CSS

.text:hover {
    position:fixed;
    top:0;
    right:0px;
    margin 0;
}

それで、あなたは何をしたいですか？

于 2013-08-07T06:48:10.553 に答える
0

私が見ているように、実際には css だけで dom 内のコンテンツを移動することはできません。ただし、同じ効果が得られるように、いつでも div を配置できます。

于 2013-08-07T06:49:07.257 に答える
0

多分あなたはそのようにすることができます：

#id1:hoover{
visibility: hidden;

}
#id2:after {
  content:'this is my text1. this is my text2.'; 
  visibility: visible;
}

いくつかのアクション フーバーまたはいくつかの js では、手がかりはコンテンツです。div のテキストを変更するには、それが役立つことを願っています。

于 2013-08-07T06:58:57.533 に答える