2017-10-10 7 views
0

文全体の代わりに<li>の特定の部分にどのようにテキスト装飾を置くことができるのだろうと思っていました。ここにコードスニペットがあります。半分の文章のHTMLテキストの装飾?

<ul> 
 
<li>I'm a List item!</li> 
 
<li style="text-decoration:line-through">From Here til here should have a line through, not these words</li>

ありがとう!

+0

2つのスパンのテキストを分割します。各スパンは異なるスタイルを持っていますか? –

答えて

1

他の要素を追加します。その要素にスタイルを適用します。あなたが通る線をする理由あなたが選択した要素

span { 
 
    text-decoration: line-through 
 
}
<ul> 
 
    <li>I'm a List item!</li> 
 
    <li><span>From Here til here should have a line through,</span> not these words</li>

は... に依存します。 <del>が適切かもしれません。

1

これを試してみてください:

span { 
 
    text-decoration: line-through 
 
}
<ul> 
 
    <li>I'm a List item!</li> 
 
    <li>From Here til here should have a <span>line through</span>, not these words</li>

1

あなたは別の要素でそれをラップする必要があります。 span要素は、一般的に、このために使用されている:これはあなたの.half-lineクラスの内部のspan要素にtext-decorationプロパティを適用します

.half-line span { 
    text-decoration: line-through 
} 

HTML

<ul> 
    <li>I'm a List item!</li> 
    <li class="half-line"><span>From Here til here should have a line through,</span> not these words</li> 
</ul> 

CSS。

関連する問題