25

HTMLでいくつかのテキストに二重下線を付けたい。

<h1><u><i> website </i></u></h1>

下部に1本ではなく2本の線があります。そのための特定のタグはありますか、それともcssで実行する必要がありますか？

4

9 に答える 9

43

これを追加してみることができます：

h1.dblUnderlined { border-bottom: 3px double; }

注：幅は全幅を3px表すため、幅以上である必要があります。各境界線の幅ではありません。測定値を大きくすると、定義された測定値の3による除算性に基づいて、線とスペースの幅が等しくなる場合と等しくない場合があります。残りの1と1がスペースの幅に追加されます。残りの2は、各行に1が追加されます。

于 2013-03-26T17:29:36.743 に答える
26

境界線と下線を使用します。

.doubleUnderline {
    text-decoration:underline;
    border-bottom: 1px solid #000;
}

<span class="doubleUnderline">Test</span>

これが実用的なフィドルです。

于 2013-03-26T17:29:05.157 に答える
4

double最も簡単な方法は、CSSでタイプの下枠を設定することです。最小の二重境界線（1pxの間隔で2つの1px境界線）を作成するには、少なくとも3ピクセルの幅が必要です。

詳細は、マークアップ、二重線の目的の幅と色、および使用可能な幅を横切るかどうかによって異なります。のようなマークアップ<h1><u><i> website </i></u></h1>は、おそらく深刻なものではありません。単純なマークアップ<h1>foobar</h1>を使用して、ページ全体で最小限の二重境界線を取得する方法は、

h1 {
  border-bottom: double 3px;
}

見出しのテキストだけを「下線付き」にしたい場合、最も簡単な方法は、などの内部マークアップ<h1><span>foobar</span></h1>とCSSコードを使用することです。

h1 span {
  border-bottom: double 3px;
}
于 2013-03-26T18:33:53.610 に答える
3

男/ギャル、これも同様に機能しますが、従来の二重下線のようなものです。

.doubleUnderline {
     text-decoration-line: underline;
     text-decoration-style: double;
}
于 2018-10-09T13:48:39.017 に答える
2

参考までに、現時点では、FirefoxまたはSafariでベンダープレフィックスを使用して次のことが可能です。

text-decoration: underline double;
-webkit-text-decoration: underline double;

text-decoration-lineを参照してください。

于 2015-03-30T18:16:46.600 に答える
2

自分だけの「タグ」を作ってみませんか？

<style>
du
{
    text-decoration-line: underline;
    text-decoration-style: double;
}
</style>
<p> I want <du>this stuff</du> double underlined.</p>

http://jsfiddle.net/eoba541g/2/

于 2018-09-12T10:21:54.950 に答える
0

次のhttp://jsfiddle.net/cKNP4/を使用してください

また

HTMLコンテナに次のスタイルを指定します。
border-top-style:none;border-right-style:none;border-bottom-style:double;border-left-style:none;border-width: 2px solid black;

于 2014-02-03T14:26:23.637 に答える
0

これが私の解決策（スタイラス）です：

$borderWidth 1px
$textColour black

$double-borders
    &:after
        content ""
        position absolute
        top 100%
        width 5.7em
        right 0
        border-top ($borderWidth * 3) double $textColour

.double-underlined
    @extend $double-borders

幅はハードコーディングする必要があることに注意してください（この場合5.7em。これが望ましい結果でない場合は、border-bottom上記の手法を使用することもできます。

于 2014-09-19T20:39:14.553 に答える
-1 
<h1 style="text-decoration: underline double;"><u>About Us</u></h1>

これは、HTMLで二重下線を付けたい場合にのみ機能します。

于 2019-10-17T09:21:43.337 に答える