タグ

ブックマーク / www.htmq.com (8)

  • <input type="number">-HTML5タグリファレンス

    <input>タグのtype属性でtype="number"を指定すると、 数値の入力欄が作成されます。 name属性は入力欄に名前を付ける属性ですが、<form>でデータが送信される際、 name属性で指定した名前と、入力された値が一組になって送信されます。 ユーザーは空文字を入力することができます。 入力必須にする場合には、required属性を併用してください。 type="number"の場合、step属性の初期値は1となります。 ■type="number"の場合に指定可能な属性 type="number" 数値の入力欄を作成する name属性 フォーム部品に名前をつける value属性 送信される値を指定する autocomplete属性 入力候補を提示して入力内容を自動補完する(on・off・default)(初期値はdefault) list属性 ユーザーに入力候補として提

    mut00tum
    mut00tum 2015/11/24
    “<input type="number">”
  • HTML5のAPI、および、関連仕様

    以下は、ウェブアプリケーションを作成する際に、必要になりそうな技術仕様の一覧です。 HTML5から追加・標準化されたAPI(Application Programming Interface)が中心ですが、それ以外の関連仕様も含まれています。

  • <input pattern>-HTML5タグリファレンス

    <input>要素のpattern属性を指定すると、正規表現を使って入力値のパターンを指定することができます。 正規表現が使えることで、特定の文字列が含まれているかどうかや、 半角英数・全角文字・ひがらなのみなど、入力制限を自由に設定できます。 ■属性

  • <dl>-HTML5タグリファレンス

    <dl>タグは、定義・説明リストを表す際に使用します。 <dl>~</dl>の中に、 <dt>タグで定義・説明される言葉を、 <dd>タグでそれに対応する説明を配置してリストを作成します。 例えば、用語の定義リストを作成したり、何かの手順を箇条書きで説明する場合などに使用します。 ■HTML4.01からHTML5へのバージョンアップによる変更点 <dl>タグのdlの由来ですが、HTML4.01ではdefinition list(定義リスト)の意味であることが示されていました。 HTML5でははっきりとは示されていませんが、description list(説明リスト)という程度の意味のようです。 また、 <dt>タグはdefinition term(定義される言葉)からdescription term(説明される言葉)へ、 <dd>タグはdefinition description(定義の

  • video要素、audio要素をJavaScriptから操作する-HTML5のAPI、および、関連仕様

    ※このページでは、video要素、audio要素をJavaScriptから操作する方法について紹介しています。 単純に<video>タグや<audio>タグの使い方を知りたい方は、 以下のページなどをご確認ください。 <video>タグで動画を埋め込む <video> …… 動画を再生する <audio> …… 音声を再生する ■video要素、audio要素をJavaScriptから操作 HTML5では、video要素、audio要素をJavaScriptから操作するためのメソッド・プロパティ・イベントが用意されています。 これらのメソッド・プロパティ・イベントを使用することで、 JavaScriptから動画・音声などのメディアリソースの状態を参照したり、 読み込み・再生・一時停止・再生可能かどうかの確認などの操作が可能となります。 <video>タグのcontrols属性を指定すると、

  • opacity-CSS3リファレンス

    CSSソースは外部ファイル(sample.css)に記述 p.sample1 {background-color:blue;} p.sample2 {opacity:0.7; background-color:blue;} p.sample3 {opacity:0.5; background-color:blue;} p.sample4 {opacity:0.3; background-color:blue;} HTMLソース <html> <head> <link rel="stylesheet" href="sample.css" type="text/css"> </head> <body> <p class="sample1"> opacityプロパティを適用していません。<br> <img src="../images/kaeru.gif"> </p> <p class="sam

    mut00tum
    mut00tum 2014/12/17
    注意
  • transition-timing-function-CSS3リファレンス

    transition-timing-functionプロパティは、変化のタイミング・進行割合を指定する際に使用します。 変化が継続している際に、その変化速度の割合を変更して調整することで動きを滑らかにすることができます。 これは一般的にイージング機能と呼ばれるもので、 グラフィックソフトで曲線を描く際などに利用されるベジェ曲線と呼ばれる数学的な関数を使います。 transition-timing-functionプロパティでは、変化の進行割合を3次ベジェ曲線で指定します。 3次ベジェ曲線は、以下の図のような4つのコントロールポイント(P0、P1、P2、P3)で定義されます。 P0が変化の開始ポイント、P3が変化の完了ポイントで、 横軸が変化継続時間がどこまで経過したのか、縦軸が変化がどの程度実行されたのかを表します。 仮にP0→P3までが直線なら、変化は一定の割合で進行することになります。

  • フォーム機能の拡張-HTML5リファレンス

    ■フォーム機能の拡張 HTML5では、フォームに関する新しい属性や指定できる属性値が多数追加される予定です。 入力必須・妥当性チェック・入力補助など、 これまでJavaScriptで作成されることの多かった機能が、 HTMLタグの属性だけで実現できるようになりそうです。 いずれも使用頻度の高い機能だけに、各ブラウザのサポートが待ち遠しいところです。 ■<input>タグのtype属性に追加される値 HTML5では、<input>タグのtype属性に指定できる値の種類が増えています。 それぞれの値を指定した場合、例えば、<input type="email">を指定すると、 この属性値をサポートしているFirefox4・Opera10・Google Chromeなどのブラウザでは、 送信ボタンを押したときに入力されている値がメールアドレスとして妥当かどうかチェックしてくれます。 また、Ope

  • 1