Wie kann man das Eltern-Div verbergen, indem man das innere Div sichtbar hält?

Unten ist eine vereinfachte Version meines Problems. Betrachtet man das folgende Stück von HTML:Wie kann man das Eltern-Div verbergen, indem man das innere Div sichtbar hält?

<div id="div1" style="display:none"> 
    text i do not want 
    <div id="div2" style="display:block"> 
    text i want to keep 
    </div> 
</div>

Aber natürlich wird nicht angezeigt „Text i halten wollen“, weil die Eltern div nicht sichtbar ist.

Frage: Wie zeigen Sie nur den Inhalt des inneren div an?

Aufgrund des Widgets, das Blogger verwendet, habe ich keinen Zugriff auf den Code und muss das äußere Div mit einigen CSS löschen. Ich habe bereits font-size: 0; nach dem Lesen this ausgeschlossen. Auch das Spielen mit negativen Margen ist aufgrund der Position der Elemente ausgeschlossen.

Quelle

2009-08-05 Anonymous

versuchen Sie dies:

color: transparent; 
background: transparent;

natürlich, die eigentlich nicht der Text nicht wählbar machen, nur nicht sichtbar.

Wirklich was Sie versuchen zu tun ist eine Art gegen das Box-Modell-Konzept, und es wäre besser, wenn Sie in der Lage waren, den Text, den Sie nicht in einem separaten div auf gleicher Ebene sehen wollten auf denen, die Sie sehen wollen, und dann das andere div verstecken, dh

<div id="div1"> 
    <div id="div3" style="display:none">text i do not want</div> 
    <div id="div2" style="display:block"> 
    text i want to keep 
    </div> 
</div>

Quelle

2009-08-05 09:36:37 Amber

Ich glaube, er sich der Tatsache bewusst ist, dass die HTML-Wechsel würde dies beheben, aber „Due Zum Widget, das der Blogger benutzt, hat er keinen Zugriff auf den Code " – Blixt

Daher das" wenn du könntest "- ich erkenne an, dass dies für seine Umstände nicht möglich ist. – Amber

Setzen Sie den ‚Text ich will nicht‘ mit Anzeige in einem anderen dIV oder SPAN: kein Stil.

Quelle

2009-08-05 09:41:20 JBRWilkinson

Aufgrund der hierarchischen Natur von HTML ist dies eine harte Nuss zu knacken. Die übliche Lösung besteht darin, ein Element aus dem anderen zu verschieben und sie so zu formatieren, dass sie verschachtelt aussehen, aber ich nehme an, dass Sie das in diesem Fall nicht tun können.

Die einzige Lösung, die ich mir vorstellen kann, wird das Elternelement aufheben, während das Kindelement absolut positioniert bleibt, aber das wird schwierig sein, wenn Sie dynamische Höhen/Breiten an den Elementen haben.

Aber versuchen Sie dies:

#div1 { 
    /* You might want to set a height here appropriate for #div2 */ 
    position: relative; 
    text-indent: -10000px; 
} 

#div2 { 
    left: 0; 
    position: absolute; 
    text-indent: 0; 
    top: 0; 
}

Quelle

2009-08-05 09:44:31 Blixt

Haben Sie nur den Text wollen, den Raum zu verschwinden oder dass der Text zu kollabieren in Anspruch nimmt?

Wenn Sie nur den Text verschwinden wollen, verwenden Sie

<div id="div1" style="text-indent:-9999px;"> 
    text i do not want 
    <div id="div2" style="text-indent:0"> 
    text i want to keep 
    </div> 
</div>

Quelle

2009-08-05 10:52:28 Emily

versuchen, dies half es mir

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
<html lang="en"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
<title>demo</title> 
<style type="text/css"> 
* { 
    margin:0; 
    padding:0; 
} 
body { 
    background: #fff; 
    font-size:100&#37;; 
} 
#hide { 
    visibility:hidden; 
} 
#show { 
    visibility:visible 
} 
</style> 
</head> 
<body> 
<div id="hide"> hide this text 
    <div id="show"> show this text </div> 
    hide this text too </div> 
</body> 
</html>

Quelle

2016-12-21 06:44:05

Wie kann man das Eltern-Div verbergen, indem man das innere Div sichtbar hält?

Antwort

Verwandte Themen