HTML

 Computer >> コンピューター >  >> プログラミング >> HTML
  1. HTMLドキュメントで長い引用を表現する方法|blockquoteタグの使い方

    blockquoteタグとはHTMLで長い引用(複数行にわたる引用文)を表現するには、<blockquote>タグを使用します。このタグは、引用全体をひとつのブロックとして囲むためのもので、ブラウザは通常、その内容をインデント(字下げ)して表示します。なお、<blockquote>タグの中にはブロックレベル要素のみを含めるのが正しいマークアップのルールです。単なるテキストを直接記述するのは避けましょう。blockquoteタグの主な属性属性値説明citeURL引用元がウェブ上にある場合、その引用元のURLを指定します。blockquoteとqタグの違い短い引用(段落内に

  2. HTMLのスクリプトでグラフィックを作成する方法を徹底解説【canvasタグの使い方】

    スクリプトを使ってグラフィックを作成したい場合は、HTMLの<canvas>タグを使用します。<canvas>タグは、JavaScriptなどのスクリプトによって図形・グラフィック・アニメーションなどを自由に描画できる専用の領域を定義する要素です。 <canvas>タグの主な属性 <canvas>タグでは、以下の2つの属性を使ってキャンバスのサイズを指定できます。 属性値説明 heightピクセル(pixels)キャンバスの高さを指定します。 widthピクセル(pixels)キャンバスの幅を指定します。 使用例:canvasで図形を

  3. HTMLでシークがアクティブになったときにスクリプトを実行する方法|onseeking属性の使い方

    onseeking属性とはHTMLでは、onseeking属性を使用することで、動画のシーク(再生位置の移動)がアクティブになった瞬間にスクリプトを実行できます。ユーザーが動画の再生バーをドラッグして別の位置に移動させようとすると、このイベントが発生し、指定したJavaScriptの関数が呼び出されます。使用例以下のコードを実行すると、動画のシークが開始されたタイミングでアラートが表示されます。<!DOCTYPE html> <html>    <body>       <video controls

  4. HTMLで要素がユーザー入力を取得したときにスクリプトを実行する方法

    要素がユーザー入力を受け取った瞬間にスクリプトを実行したい場合は、oninputイベント属性を使用します。oninputは、テキストフィールドやテキストエリアなどに入力が行われるたびに発生するイベントで、リアルタイムな入力チェックや表示の更新に便利です。以下のコードは、oninput属性を使って入力内容を即座に画面に反映させる実装例です。サンプルコード<!DOCTYPE html> <html>    <body>       <p>下記に名前を入力してください:</p>  

  5. 【HTML】noembedタグでembedタグ非対応ブラウザに代替コンテンツを表示する方法

    noembedタグとは HTMLの<noembed>タグは、<embed>タグに対応していないブラウザへの対策として使用されるタグです。ブラウザが埋め込みコンテンツを表示できない場合に、代わりに別の内容(画像やテキストなど)を表示させるためのフォールバック(代替)コンテンツを定義できます。 このタグを活用すれば、プラグインが必要なコンテンツが閲覧できない環境のユーザーに対しても、「何が表示されていないのか」を知らせる代替情報をスムーズに提供できるのが大きなメリットです。 使用例 以下は、SWFファイルが表示できないブラウザ向けに、代替画像を表示させるサンプルコードです

  6. HTMLでnoframesセクションを追加する方法をわかりやすく解説

    <noframes>タグを使用すると、フレーム非対応のブラウザ向けに代替コンテンツ(noframesセクション)を追加できます。 HTMLの<noframes>タグは、<frame>タグに対応していないブラウザのための処理に使われる要素です。このタグ内に記述した内容は、フレームを表示できない環境のユーザーに対して、代わりのテキストメッセージとして表示されます。フレーム対応ブラウザでは、この部分の内容は無視されるため、通常の表示には影響しません。 基本的な使い方 <noframes>タグは、<frameset>タグの中に配置します。タグ

  7. HTMLのnoscriptタグとは?使い方と実装例をわかりやすく解説

    HTMLでnoscriptセクションを追加するには、<noscript>タグを使用します。このタグは、<script>タグを認識するもののスクリプトの実行に対応していないブラウザや、ユーザーがJavaScriptを無効化している環境向けに設計されています。 <noscript>タグ内に記述した内容は、スクリプトが動作しない場合にのみ表示される代替テキストとして機能します。これにより、JavaScriptが利用できない環境でも、ページの訪問者に適切なメッセージを伝えることができます。 noscriptタグの基本的な使い方 <noscript>タグは

  8. HTMLで埋め込みオブジェクトを含める方法|objectタグの使い方と属性一覧

    埋め込みオブジェクトをHTMLに含める方法HTML文書に埋め込みオブジェクトを含めるには、<object>タグを使用します。HTMLの<object>タグは、画像や動画、音声などのマルチメディアコンテンツをHTML文書内に埋め込むためのタグです。また、<param>タグを<object>タグと組み合わせて使用することで、埋め込むオブジェクトに対してさまざまなパラメータを渡すことができます。<object>タグで利用できる主な属性HTMLの<object>タグでは、以下のような属性がサポートされています。属性値説明align

  9. HTMLでインラインフレーム(iframe)を含める方法

    インラインフレーム(iframe)とはHTMLにおけるインラインサブウィンドウは「iframe(インラインフレーム)」と呼ばれる要素で、<iframe>タグを使用することで、現在のページの中に別のWebページやドキュメントを埋め込むことができます。地図の表示や外部動画の埋め込みなど、さまざまな場面で活用されています。<iframe>タグの主な属性一覧<iframe>タグでは、以下のような属性を指定できます。属性値説明alignleftrighttopmiddlebottom周囲のテキストに対してiframeをどのように配置するかを指定します。framebor

  10. HTMLで順序付きリスト(番号付きリスト)を作成する方法

    HTMLの <ol> タグは、順序付きリスト(番号付きリスト)を作成するために使用します。各リスト項目は <li> タグで定義し、ブラウザ上には先頭に番号が付いた形で表示されます。手順やランキングなど、項目の並び順に意味があるコンテンツに適しています。 <ol>タグで利用できる主な属性 <ol> タグでは、以下の属性を使ってリストの表示方法を細かく制御できます。 属性値説明 compactcompactリストをコンパクトに表示することを指定します(現在は非推奨の属性です)。 reversedreversedリストの順序を降順(大きい番号か

  11. HTMLでインラインレイヤーを追加する方法|ilayerタグの使い方と属性一覧

    インラインレイヤーを追加するには、<ilayer>タグを使用します。HTMLの<ilayer>タグは、本文のテキストフロー内にスペースを占めるレイヤーを作成するためのものであり、それ以降のコンテンツは、このレイヤーが占めたスペースの後ろに配置されます。これに対して<layer>タグは、テキストフロー全体の上に重なるレイヤーを作成します。そのため、後に続くコンテンツは、作成したレイヤーの下に隠れる形で配置される点が大きな違いです。注意:非標準の廃止タグです<ilayer>および<layer>は、かつてNetscape Navigator

  12. HTMLでオプショングループ(optgroup)を作成する方法

    HTMLの <optgroup> タグは、セレクトボックス(<select>)内の関連する選択肢をグループ化するために使用します。選択肢が多いリストでも、ユーザーが自分の選択肢を把握しやすくなるため、フォームの使いやすさ向上に役立ちます。 optgroupタグの主な属性 <optgroup> タグでは、以下の属性を使用できます。 属性値説明 disabled disabled そのグループ全体を無効化します。ユーザーはグループ内の選択肢を選択できなくなり、Tabキーによるフォーカス移動の対象からも除外されます。 label テキスト グループに

  13. HTMLのstyle属性とは?インラインCSSの設定方法をわかりやすく解説

    HTMLでは、style属性を使用することで、要素に直接CSSスタイルを指定できます。この方法はインラインCSSと呼ばれ、特定の要素だけにスタイルを適用したい場合に便利です。 外部スタイルシートや<style>タグを使わずに、HTMLタグの中に直接記述できるため、簡単なスタイル調整やテストの際によく利用されます。 style属性の基本構文 <タグ名 style = プロパティ: 値;> style属性の値には、通常のCSSと同じ形式でプロパティと値を「コロン(:)」で区切って記述します。複数のスタイルを指定する場合は、「セミコロン(;)」で区切ります。 実装例 以下のコ

  14. HTMLのtabindex属性でタブ移動の順序を指定する方法を解説

    HTMLでは、tabindex属性を使用することで、要素のタブ移動(Tabキーによるフォーカス移動)の順序を自由に指定できます。通常、Tabキーを押すとHTMLの記述順にフォーカスが移動しますが、tabindex属性を設定すれば、その順序を意図的に変更することが可能です。 tabindex属性の基本的な使い方 tabindex属性には正の整数値(1、2、3…)を設定します。Tabキーが押されると、値が小さい要素から順にフォーカスが移動します。例えば「tabindex=1」が設定された要素が最初に、「tabindex=2」が設定された要素が次にフォーカスされます。 以下のコードは、リンク要素に対

  15. HTMLコードにコメントを追加する方法をわかりやすく解説

    HTMLコードにコメントを残しておくと、後から自分でコードを見返したときや、他の開発者がコードを読む際に、その意図や処理内容を理解しやすくなります。本記事では、HTMLでコメントを記述する正しい方法について解説します。 HTMLの<comment>タグとは HTMLには<comment>タグが存在し、これを使うことでHTMLコード内にコメントを記述することができました。しかし、このタグは一部のブラウザ(旧Internet Explorerなど)でしか動作しないため、現在ではほとんど利用されていません。 推奨されるコメントの書き方 HTMLでコメントを記述する際は、<

  16. HTML5のtranslate属性とは?グローバル変換属性の使い方をわかりやすく解説

    HTML5のtranslate属性(グローバル変換属性)とはHTML5で利用できるtranslate属性は、要素の内容を翻訳ツール(Google翻訳など)で翻訳するかどうかを指定できるグローバル属性です。ブランド名、固有名詞、コードなど「翻訳されたくないテキスト」を明示的に指定したい場合に非常に便利です。translate属性に指定できる値属性値説明yesその要素の内容は翻訳されるべきであることを示します。noその要素の内容は翻訳されるべきではないことを示します。具体的な使い方特定の単語や文章を翻訳対象から除外したい場合は、translate属性に「no」を指定します。<p transl

  17. HTMLでハイパーリンクを作成する方法!aタグの使い方と属性一覧を解説

    aタグとは?ハイパーリンクの基本HTMLで別のドキュメントへのリンク(ハイパーリンク)を作成するには、<a>(アンカー)タグを使用します。<a>タグは、外部サイトや別ページへのリンクはもちろん、同じページ内の特定の場所へジャンプするリンクにも利用できる、HTMLの最も基本的かつ重要な要素のひとつです。aタグの主な属性一覧<a>タグにはさまざまな属性があり、リンクの挙動を細かく制御できます。主な属性は以下のとおりです。属性値説明charset※非推奨character_encodingリンク先ドキュメントの文字エンコーディングを定義します。HTML5では廃止さ

  18. HTMLで画像マップの領域を定義する方法|areaタグの属性と使い方を解説

    HTMLで画像マップ(イメージマップ)のクリック可能な領域を定義するには、<area>タグを使用します。<area>タグは<map>タグの中に記述し、1枚の画像の特定部分ごとに異なるリンクを設定することができます。 <area>タグで使える主な属性 属性値説明 altテキスト領域の代替テキストを指定します。 coordsshape=rect の場合:coords=left, top, right, bottomshape=circ の場合:coords=centerx, centery, radiusshape=poly の場合:co

  19. HTML5で記事を追加するには?articleタグの使い方を解説

    HTML5で記事を追加するには、<article>タグを使用します。HTMLの<article>タグは、ブログ記事、フォーラムへの投稿、新聞記事などに用いられる要素で、サイト・ドキュメント・ページ・アプリケーションの中にある「自己完結したコンテンツ(それ単体で意味が成立するまとまり)」を定義するために使われます。例えば、ニュースサイトの個別記事や、ブログの各投稿のように、他の部分と切り離しても内容として成立するブロックに対してこのタグを適用するのが適切です。サンプルコード以下のコードを実行すると、<article>タグを使った記事の追加を実際に確認できます。

  20. HTMLで用語集の定義を追加する方法|dlタグの使い方を解説

    HTMLで用語集(定義リスト)を追加するには、<dl>タグを使用します。HTMLの<dl>タグは定義リストを宣言するための要素で、リストの中に用語を示す<dt>タグと、その説明を示す<dd>タグを組み合わせて記述します。定義リストは通常の箇条書きリストとよく似ていますが、各項目が「用語」と「その説明」の2つの要素で構成されている点が大きな特徴です。この形式は、用語集やFAQ、仕様書など、言葉とその意味を対にして見せたい場合に非常に便利です。サンプルコード以下のコードを実行すると、<dl>タグを使った定義リストの表示を確認できます。&l

Total 2020 -コンピューター  FirstPage PreviousPage NextPage LastPage CurrentPage:80/101  20-コンピューター/Page Goto:1 74 75 76 77 78 79 80 81 82 83 84 85 86