CSSでテキストを非表示

私はWordPressからウェブサイトで作業していますが、何らかの理由でCSSを編集できますが、HTMLは編集できません。コードは次のとおりです。CSSでテキストを非表示

表示

.entry-header .entry-title::after { 
 
    content: "Create Theme" !important; 
 
}

<header class="entry-header "> 
 
    <h1 class="entry-title "> 
 
      "Create Course" 
 
      ::after 
 
     </h1> 
 
</header>

：Create CourseCreate Themeを。そして私はそれが表示する：Create Theme。これはCSSによって可能ですか？

出典

2016-08-25 Jon Smith

私は最初に、あなたの問題の根本を見つけるだろう - むしろあなたの問題を解決するためのハックを見つけることよりも。 * WHY *あなたはHTMLを編集できませんか？パーミッション？問題のページを編集するHTMLはありませんか？以前はWPのサイトで経験がありませんでした。ホームページにはHTMLがありませんでした。誰かが行ってテンプレートですべて設定しました。これはサイトのテンプレート設定のどこかに隠されていました。可能であれば、あなたが経験している深刻な問題に対処してください:) –

これは少し醜いハックすることができますが、あなたは、元のテキストを非表示にするtext-indentで遊ぶことができるHTMLを変更してからのような後の擬似要素にdisplay: block;を設定することにより、親のtext-indentを上書きすることができない場合は、あなたの状況を考慮するかもしれませんこの：

.entry-header .entry-title { 
 
    text-indent: -9999px; 
 
} 
 

 
.entry-header .entry-title::after { 
 
    text-indent: 0px !important; 
 
    display: block; 
 
    float: left; 
 
    content: "Create Theme"; 
 
}

<header class="entry-header "> 
 
    <h1 class="entry-title ">Create Course</h1> 
 
</header>

出典

2016-08-25 11:39:30 thepio

ありがとう！これは働いた:) –

助けてよかった！ :) – thepio

@JonSmith - この回答があなたの問題を解決した場合、可能な限り「受け入れられた」とマークするのは偽造しないでください:) –

あなたはvisibilityは大丈夫だと思う場合は、JSFiddleを試してみてください。

.entry-header .entry-title { 
    visibility: hidden; 
} 
.entry-header .entry-title::after { 
    content: "Create Theme" !important; 
    visibility: visible; 
}

問題は、テキストentry-titleがまだその領域を占有することです。

参考：Hide element, but show CSS generated content

出典

2016-08-25 11:40:30 Joy

答えて

関連する問題