css - タグにないテキストのCSSセレクター

Question

日付.byline 以外は全部隠したいです。マークアップを変更せずにCSSを介してこれを行うことは可能ですか？タグに含まれていない内部テキストをターゲットにできるCSSセレクターはありますか？

<p class="byline">
    By <a rel="author" href="#">John Doe</a>
    on <time datetime="2012-10-10" pubdate>2012</time>
</p>

これはb/cでは機能しませんaが、他のテキストは非表示になります。

.byline :not(time) { display:none }

これは、すべてを非表示にするb/cでは機能しません。

.byline { display:none }
.byline time { display:inline }

これは機能しますが、理想的なb / cではありません。その場合は、スペースの非表示にも対処する必要があります。

.byline { visibility:hidden }
.byline time { visibility:visible }

score 2 · Accepted Answer

CSSは要素のみを選択でき、ベアテキストは選択できません。:not(time)これが機能しない理由です（選択するだけaです）。

display: noneコンテナが機能しdisplay: inlineない理由display: noneは、コンテナを他の何かに設定しようとしても、コンテナとそのすべてのコンテンツが表示されないためです（さらに、デフォルトでtimeすでに表示さinlineれています）。

score 2 · Accepted Answer

もちろん、 @ BoltClockは、テキストを選択することはできず、要素だけを選択することはできます。ただし、次の回避策が機能するはずです。

.byline {
    font-size: 0px;
    color: transparent;
}
.byline time {
    font-size: medium;
    color: black;
}

score 2 · Accepted Answer

.byline {font-size:0px; }
.byline time {font-size:15px}

3 に答える 3