1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
|
---
title: '<tt>: テレタイプテキスト要素 (廃止)'
slug: Web/HTML/Element/tt
tags:
- Element
- HTML
- Monospace
- Monotype
- Non-proportional Type
- Obsolete
- Reference
- Teletype
- Teletype Text
- Web
- font-family
- tt
translation_of: Web/HTML/Element/tt
---
<div>{{HTMLRef}}{{obsolete_header}}</div>
<p><span class="seoSummary">廃止された <strong>HTML テレタイプテキスト要素</strong> (<strong><code><tt></code></strong>) は、{{Glossary("user agent", "ユーザーエージェント")}}の既定の等幅フォントで表示される行内文字列を生成します。</span>この要素は、テレタイプ、テキスト専用画面、ラインプリンターのような等幅の表示装置で表示されるテキストとしてスタイルを設定しようとするものです。</p>
<p><strong>等幅フォント</strong> や <strong>モノスペースフォント</strong> は交換可能で同じ意味を持っています。これらは文字の幅がすべて同じピクセル数のフォントを説明する言葉です。</p>
<p>しかし、この要素は廃止されました。等幅フォントで表現する必要がある行内テキストには、より意味的に役立つ {{HTMLElement("code")}}, {{HTMLElement("kbd")}}, {{HTMLElement("samp")}}, {{HTMLElement("var")}} 要素を使用するか、中身を独自のブロックとして表現する場合は {{HTMLElement("pre")}} タグを使用してください。</p>
<div class="note">使用する場面に適切な意味的要素がない場合（例えば、一部のコンテンツを等幅フォントで表示する必要がある場合）は、 {{ HTMLElement("span") }} 要素を使用し、 CSS を使用して好きに整形することを検討してください。 {{cssxref("font-family")}} プロパティは始めるのにいいところです。</div>
<table class="properties">
<tbody>
<tr>
<th scope="row"><a href="/ja/docs/Web/HTML/Content_categories">コンテンツカテゴリ</a></th>
<td><a href="/ja/docs/Web/HTML/Content_categories#Flow_content">フローコンテンツ</a>, <a href="/ja/docs/Web/HTML/Content_categories#Phrasing_content">記述コンテンツ</a>, 知覚可能コンテンツ</td>
</tr>
<tr>
<th scope="row">許可されている内容</th>
<td><a href="/ja/docs/Web/HTML/Content_categories#Phrasing_content">記述コンテンツ</a></td>
</tr>
<tr>
<th scope="row">タグの省略</th>
<td>{{no_tag_omission}}</td>
</tr>
<tr>
<th scope="row">許可されている親要素</th>
<td><a href="/ja/docs/Web/HTML/Content_categories#Phrasing_content">記述コンテンツ</a>を受け入れるすべての要素</td>
</tr>
<tr>
<th scope="row">許可されている ARIA ロール</th>
<td>すべて</td>
</tr>
<tr>
<th scope="row">DOM インターフェイス</th>
<td>{{domxref("HTMLElement")}}</td>
</tr>
</tbody>
</table>
<h2 id="Attributes" name="Attributes">属性</h2>
<p>この要素には<a href="/ja/docs/Web/HTML/Global_attributes">グローバル属性</a>のみがあります。</p>
<h2 id="Example" name="Example">例</h2>
<h3 id="Basic_example" name="Basic_example">基本的な例</h3>
<p>この例では、 <code><tt></code> を使ってターミナルアプリケーションに入力したり出力したりしたテキストを表示します。</p>
<pre class="brush:html notranslate"><p>Enter the following at the telnet command prompt: <code>set localecho</code><br />
The telnet client should display: <tt>Local Echo is on</tt></p>
</pre>
<h3 id="Result" name="Result">結果</h3>
<p>{{EmbedLiveSample("Basic_example", 650, 80)}}</p>
<h3 id="Overriding_the_default_font" name="Overriding_the_default_font">既定のフォントの上書き</h3>
<p>行う必要はありませんが、ブラウザーが許可していれば、ブラウザーの既定のフォントを上書きすることができます。 CSS を使用します。</p>
<h4 id="CSS">CSS</h4>
<pre class="brush: css notranslate">tt {
font-family: "Lucida Console", "Menlo", "Monaco", "Courier",
monospace;
}</pre>
<h4 id="HTML">HTML</h4>
<pre class="brush: html notranslate"><p>Enter the following at the telnet command prompt: <code>set localecho</code><br />
The telnet client should display: <tt>Local Echo is on</tt></p></pre>
<h4 id="Result_2" name="Result_2">結果</h4>
<p>{{EmbedLiveSample("Overriding_the_default_font", 650, 80)}}</p>
<h2 id="Usage_notes" name="Usage_notes">使用上のメモ</h2>
<p>既定では <code><tt></code> 要素はブラウザーの既定の等幅フォントを使って表示されます。前述の {{anch("Overriding the default font")}} にある通り、 CSS で <code>tt</code> セレクターを使用した規則を作成することで、これを上書きすることができます。</p>
<div class="note">
<p>既定の等幅フォントの設定を変更するユーザー設定が CSS よりも優先することがあります。</p>
</div>
<p>この要素は HTML 4.01 では公式には非推奨にされませんでしたが、使用は避けて意味的要素や CSS を使用するとされていました。 <code><tt></code> 要素は HTML 5 で廃止されました。</p>
<h2 id="Specifications" name="Specifications">仕様書</h2>
<table class="standard-table">
<thead>
<tr>
<th scope="col">仕様書</th>
<th scope="col">状態</th>
<th scope="col">備考</th>
</tr>
</thead>
<tbody>
<tr>
<td>{{SpecName('HTML5 W3C', 'obsolete.html#elementdef-tt', '<tt>')}}</td>
<td>{{Spec2('HTML5 W3C')}}</td>
<td></td>
</tr>
<tr>
<td>{{SpecName('HTML4.01', 'present/graphics.html#h-15.2.1', '<tt>')}}</td>
<td>{{Spec2('HTML4.01')}}</td>
<td></td>
</tr>
</tbody>
</table>
<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2>
<p>{{Compat("html.elements.tt")}}</p>
<h2 id="See_also" name="See_also">関連情報</h2>
<ul>
<li>意味的な {{HTMLElement("code")}}, {{HTMLElement("var")}}, {{HTMLElement("kbd")}}, {{HTMLElement("samp")}} 要素</li>
<li>{{HTMLElement("pre")}} 要素: 整形済みテキストブロックを表示する要素</li>
</ul>
|
