HTML

 Computer >> コンピューター >  >> プログラミング >> HTML
  1. HTMLでファイルアップロードボタンを作成する方法をわかりやすく解説

    HTMLでファイルアップロードボタンを作成するには、<input>要素のtype属性に「file」を指定します。これにより、ユーザーが自分のPCやスマートフォンからファイルを選択してアップロードできるボタンが簡単に設置できます。 コード例 <!DOCTYPE html> <html> <head> <title>ファイルアップロードボタンの例</title> </head> <body> <h1>ファイルアップロードボタンの例</h1> <p>「ファイルを選択」ボ

  2. HTML DOM write()メソッドとは?構文と使い方を実例で解説

    HTML DOM の write() メソッドは、HTML や JavaScript などの複数の式をドキュメントに直接書き出すための機能です。ページの読み込み時に動的にコンテンツを生成したり、別ウィンドウへメッセージを出力したりする場面で活用されます。注意: このメソッドには重要な特徴が2つあります。ひとつは、ドキュメント内にすでに HTML コードが存在する場合、それを上書きしてしまうという点。もうひとつは、引数を渡しても自動的には改行されず、そのまま連結されるという点です。用途によっては意図しない表示になることがあるため、挙動を理解した上で使うことが大切です。構文write() メソッド

  3. HTML DOM writeln()メソッドの使い方を徹底解説！サンプルコード付き

    HTML DOM の writeln() メソッドは、複数の式（HTML や JavaScript）をドキュメントに直接書き込むための機能を提供します。注意： このメソッドは、ドキュメント内に既存の HTML コードがある場合、それを上書きします。また、渡された引数はそれぞれ新しい行に追加される点が特徴です。構文writeln() メソッドの基本的な構文は以下の通りです。document.writeln(argument1, argument2, ...)カンマで区切ることで、複数の引数（文字列や HTML 要素など）を一度に渡すことができます。各引数は改行されて出力されます。writeln(

  4. HTMLのdraggable属性とは？使い方とサンプルコードを解説

    HTMLのdraggable属性とはHTML DOMのdraggable属性は、要素がドラッグ可能かどうかを示す真偽値（boolean）を取得・設定するための属性です。この属性を活用することで、ドラッグ＆ドロップ操作に対応したインタラクティブなWebページを簡単に実装できます。注意：リンク（<a>タグ）や画像（<img>タグ）は、デフォルトでドラッグ可能に設定されています。draggable属性に指定できる値true … 要素をドラッグ可能にするfalse … 要素をドラッグ不可にするauto … ブラウザのデフォルト動作に従うHTML draggable属性の使用例以

  5. HTMLエディターとは？代表的な無料エディターの特徴を徹底解説

    HTMLエディターとはHTMLエディターとは、HTMLドキュメントの作成・編集を行い、場合によってはその場で実行までできるツールのことです。現在では、無料・有料を問わず、プロフェッショナル向けの高機能なHTMLエディターが数多く提供されています。Windows標準のメモ帳（Notepad）にはない、テーマのカスタマイズやターミナル連携といった付加機能を備えたエディターも多く、用途やスキルレベルに合わせて選ぶことができます。ここでは、特によく使われている代表的なHTMLエディターをご紹介します。Notepad（メモ帳）最も基本的な無料HTMLエディターの一つです。Windowsに標準搭載されてお

  6. HTMLとHTML5の違いとは?主要な5つの相違点をわかりやすく解説

    Webページ制作の基礎となるHTMLについて学ぶ前に、まず「マークアップ言語」という概念を理解しておきましょう。HTMLは「Hyper Text Mark-up Language(ハイパーテキスト・マークアップ言語)」の略称で、タグ(tag)を使ってテキスト文書の構造を定義する言語です。このタグによって、Webページ全体の構造が決定されます。つまりHTMLとは、「ハイパーテキスト」と「マークアップ言語」を組み合わせたものなのです。 HTML5はHTMLの発展版(上位バージョン)にあたるため、新たに追加された機能を中心として、両者にはいくつかの顕著な違いが存在します。以下の表は、HTMLとHT

  7. HTMLの:focusセレクターと:activeセレクターの違いをわかりやすく解説

    CSSの擬似クラスには、要素の状態に応じてスタイルを適用できる便利なセレクターが多数用意されています。その中でも初心者が混同しやすいのが「:focus」と「:active」です。この記事では、両者の違いと具体的な使い方をサンプルコード付きで解説します。 :focusセレクターとは :focusセレクターは、ボタン、リンク、入力欄（input）などのフォーム要素がフォーカスを受け取ったときにスタイルを適用するための擬似クラスです。 要素はマウスでクリックするか、Tabキーを使うことでフォーカスを取得できます。一度フォーカスされた要素は、別の要素にフォーカスが移るまで状態が維持される点が特徴です。

  8. HTMLメールの作成方法とGmailでの送信手順を徹底解説

    HTMLメールも一種のメールですが、Webページと同様に、画像・色・リンク・表などを用いて装飾された形式のメールです。ニュースレター購読時に受け取ったことがある方も多いでしょう。あのような見た目のメールがHTMLメールです。一方、プレーンテキストメールとは文字情報のみで構成されたシンプルなメールのことを指します。社内での日常的なやり取りをイメージすると分かりやすいでしょう。 一般的に、マーケターの間で「どちらの形式が優れているか」という議論はほぼ存在しません。マーケティング施策としては、HTMLメールの方が常に高い成果（コンバージョン）を出す傾向があるからです。ただし、どちらの形式を採用する

  9. HTML DOMのVideo widthプロパティとは？動画の幅を取得・設定する方法

    HTML DOM の Video width プロパティは、<video> 要素で表示されるメディアの幅（width）に対応する数値を取得・設定できるプロパティです。単位はピクセル（px）で扱われ、JavaScript から動的に動画プレイヤーの横幅を変更したい場合に活用できます。 構文（Syntax） width プロパティの基本的な構文は以下のとおりです。 現在の幅（px）を取得する場合 mediaObject.width 幅（px）を新しく設定する場合 mediaObject.width = number なお、HTML 属性として記述された初期値は <video wi

  10. HTML DOM WheelEvent deltaXプロパティとは？水平スクロール量の取得方法を解説

    HTML DOMのWheelEvent deltaXプロパティは、ユーザーがマウスホイールなどで水平方向（左または右）にスクロールした量を符号付きの数値として返します。スクロール方向が垂直方向など水平以外の場合、このプロパティは0を返します。戻り値の意味正の値：ユーザーが右方向にスクロールした負の値：ユーザーが左方向にスクロールした0：水平方向のスクロールが行われていないなお、垂直方向のスクロール量を取得する場合は、同じWheelEventオブジェクトが持つdeltaYプロパティを使用します。構文構文は以下の通りです。符号付きの数値を返します。event.deltaXそれでは、HTML DOM

  11. HTML DOM WheelEvent deltaYプロパティの使い方と実例解説

    HTML DOMのWheelEvent deltaYプロパティは、ユーザーが上方向または下方向のどちらにスクロールしているかに対応する符号付きの数値を返します。上下以外の方向（左右など）にスクロールした場合、このプロパティは0を返します。具体的には、下方向にスクロールした場合は正の値、上方向にスクロールした場合は負の値が返され、スクロール量が大きいほど値の絶対値も大きくなります。構文以下が構文です。符号付き数値を取得する場合：event.deltaY戻り値deltaYプロパティが返す値は以下のとおりです。正の値：下方向にスクロールした場合負の値：上方向にスクロールした場合0：左右方向など、上下

  12. HTML DOMのWindow closedプロパティとは？使い方とサンプルコードを解説

    HTML DOMのWindow closedプロパティは、ウィンドウが閉じられているかどうかの状態を示す真偽値（boolean）を返します。ウィンドウがすでに閉じている場合はtrue、まだ開いている場合はfalseが返されます。このプロパティは、window.open()で開いたポップアップウィンドウの状態を監視したり、ユーザーによって閉じられたウィンドウを再オープンするかどうかを判定したりする際に非常に便利です。構文Window closedプロパティの構文は以下の通りです。window.closed戻り値：true（ウィンドウが閉じている場合）／ false（ウィンドウが開いている場合）サ

  13. HTML DOM Window frameElementプロパティの使い方を徹底解説

    HTML DOMのWindow frameElementプロパティは、現在のウィンドウが埋め込まれているHTML要素（<embed>、<iframe>、<object>など）を取得するためのプロパティです。ウィンドウがiframeなどの要素に埋め込まれていない場合（トップレベルウィンドウの場合）、このプロパティはnullを返します。そのため、ページがフレーム内で表示されているかどうかを判定したい場面で非常に役立ちます。構文frameElementプロパティの基本的な構文は以下のとおりです。window.frameElement使用例ここでは、HTML DOM

  14. 【HTML DOM】Window framesプロパティの使い方とサンプルコード

    HTML DOM の Window frames プロパティは、現在のウィンドウ内に存在するすべてのフレーム（<iframe> 要素など）に対応するオブジェクトを返します。このプロパティを利用することで、ページ内の各フレームにプログラムからアクセスし、内容や URL（location）を操作できるようになります。構文構文は以下のとおりです。現在のウィンドウ内のフレームを取得する場合：window.framesframesプロパティのポイント配列風（Array-like）オブジェクト：length プロパティやインデックスによるアクセスが可能です。各要素は window オブジェクト

  15. HTML DOM localStorageプロパティとは？使い方を実例つきでわかりやすく解説

    HTML DOMのlocalStorageプロパティを使うと、キーと値のペア（Key-Valueペア）をユーザーのブラウザ内に直接保存し、必要なときにいつでも参照できます。保存されたデータは明示的に削除・クリアしない限り失われないため、ページの再読み込みやブラウザの再起動後も保持されます。 構文 localStorageの構文は以下のとおりです。 Window.localStorage localStorageオブジェクトには、主に次のようなメソッドが用意されています。 setItem(key, value) … 指定したキー名で値を保存する getItem(key) … 指定したキー名に対

  16. HTML DOM Window openerプロパティとは？使い方とサンプルコードを徹底解説

    HTML DOM の window.opener プロパティは、window.open() メソッドによって開かれた子ウィンドウに対して、その親ウィンドウ（呼び出し元のウィンドウ）への参照を返すプロパティです。このプロパティを活用することで、子ウィンドウから親ウィンドウの要素や関数にアクセスしたり、親子間でデータのやり取りを行ったりすることが可能になります。 構文（シンタックス） window.opener プロパティの基本的な構文は以下の通りです。 親ウィンドウへの参照を取得する場合： window.opener サンプルコード それでは、HTML DOM Window opener プロパ

  17. HTML DOM Window parentプロパティとは？親ウィンドウへの参照を取得する方法

    HTML DOM の Window parent プロパティは、子ウィンドウの親ウィンドウへの参照を返すプロパティです。window.open() で開いた別ウィンドウや iframe から、元になった親ウィンドウの要素やスクリプトへアクセスしたい場合に活用できます。 構文 親ウィンドウへの参照を取得するには、次のように記述します。 window.parent サンプルコード HTML DOM Window parent プロパティの使用例を見てみましょう。テキストフィールドに入力した URL を子ウィンドウとして開き、「移動」「閉じる」「復元」の各ボタンで子ウィンドウを制御します。その際、p

  18. HTML DOM Window stop()メソッドの使い方を徹底解説

    HTML DOM の Window stop() メソッドは、ブラウザの「停止」ボタンをクリックしなくても、JavaScript からウィンドウのリソース読み込みを中断できる便利な機能です。ページの読み込み中に特定の条件を満たさない場合など、プログラム側で任意のタイミングで読み込みを止めたいときに活用できます。構文stop() メソッドの基本的な構文は以下のとおりです。window.stop()サンプルコードここでは、HTML DOM Window stop() メソッドの具体的な使用例を紹介します。このサンプルでは、入力された名前が「admin」であれば新しい子ウィンドウを開き、それ以外の場

  19. HTML DOM Video playbackRateプロパティの使い方！再生速度の取得・設定を解説

    HTML DOMのVideo playbackRateプロパティは、動画メディアの現在の再生速度に対応する数値を取得・設定できるプロパティです。標準の再生速度は「1.0」で、値を大きくすれば早送り、小さくすればスロー再生として動作します。 構文 以下が構文の基本形です。 playbackRateの値を取得する（数値として返す） mediaObject.playbackRate playbackRateに値を設定する mediaObject.playbackRate = number 注意：設定できる数値の最大値は「16」です。また、「0.0」を指定すると動画は静止した状態になります。 Vide

  20. HTML DOM Video playedプロパティとは？動画の再生済み範囲を取得する方法をわかりやすく解説

    HTML DOM の Video played プロパティは、動画のうち実際に再生された範囲に関する情報――再生済み範囲の長さ、開始位置、終了位置――を格納した TimeRanges オブジェクトを返します。TimeRanges オブジェクトには、再生範囲の数を表す length プロパティのほか、start(index) および end(index) メソッドが用意されており、指定した範囲の開始時刻と終了時刻を秒単位で取得することができます。構文構文は以下のとおりです。TimeRanges オブジェクトを返す場合：mediaObject.playedサンプルコードVideo played プ

Total 2020 -コンピューター  FirstPage PreviousPage NextPage LastPage CurrentPage:10/101  20-コンピューター/Page Goto:1 4 5 6 7 8 9 10 11 12 13 14 15 16