最新のWeb開発のチュートリアル

HTML例


HTMLの基本

HTMLドキュメント
HTMLの見出し
HTMLの段落
HTMLリンク
HTMLの画像

例について説明しました


HTML属性

title属性
href属性
幅と高さの属性
alt属性
引用符なしの属性
引用符なしの属性は動作しません。

例について説明しました


HTML見出し

HTMLの見出し
HTML水平ルール
HTMLのhead

例について説明しました


HTML段落

HTMLの段落
もっとHTMLの段落
HTMLでの改行の使用
詩の問題(HTMLフォーマットのいくつかの問題)
どのように改行やスペースを制御するため<pre>タグ

例について説明しました


HTMLのスタイル

HTMLスタイル
HTMLの背景色
HTMLのテキストの色
HTMLテキストのフォント
HTMLテキストサイズ
HTMLのテキストの配置

例について説明しました


HTMLテキストの書式設定

使用して太字の書式<b>要素を
使用して強力な書式設定<strong>要素を
使用して斜体<i>要素を
使用して書式設定強調<em>要素を
用いた小型の書式<small>要素を
使用して書式設定マーク<mark>要素を
マーク使用して削除<del>要素を
使用して挿入マーク<ins>要素を
マーク使用して削除や挿入<del><ins>
使用して、下付き文字の書式設定<sub>要素を
使用して上付き書式<sup>要素を

例について説明しました


HTMLの名言と引用

短い引用フォーマット<q>要素を。
書式はでセクションを引用符で囲まれた<blockquote>要素。
文書作成者/所有者情報をフォーマット<address>要素
略語をフォーマットすると頭字語<abbr>要素を
書式設定作業のタイトル<cite>要素
書式設定テキストの方向<bdo>要素

例について説明しました


HTML Computercode要素

キーボード入力使用して書式設定<kbd>要素を
使用して、コンピュータの出力フォーマット<samp>要素を
プログラミングコード使用して書式設定<code>要素を
保存空白や改行をフォーマットプログラミングコード
使用して変数の書式<var>要素を

例について説明しました


HTMLのコメント

隠しコメント
条件付きコメント
デバッグのためのコメント

例について説明しました


HTMLのCSS

インラインCSSとHTML
内部CSSを使用したHTML
外部CSSとHTML
CSSのフォントでHTML
id属性を使用してCSSを使用したHTML
class属性を使用してCSSを使用したHTML
HTMLとCSSの境界線
HTMLとCSSパディング
HTMLとCSSのマージン
HTMLとCSSのフルデモ

例について説明しました


HTMLリンク

絶対URLを使用して、リンク
相対URLを使用して、リンク
リンクの色を変更します
リンクから下線を削除します
リンクのターゲットを変更します
リンクとしてのイメージ
ブックマークのリンクを作成
フレームの勃発リンク
mailtoのリンク
主題とのmailtoリンク

例について説明しました


HTMLの画像

マウンテン
属性を使用して画像の高さと幅
CSSを使用して、画像の高さと幅
両方を用いて画像の高さと幅
別のフォルダ内の画像
リンク切れのある画像
別のサーバ上のイメージ
リンクとして画像を使用して
動画
クリック可能な領域を持つイメージマップ
浮動画像

例について説明しました


HTMLテーブル

基本的なHTMLテーブル
境界線を持つ表
折りたたまれた国境を持つテーブル
セルのパディングを持つテーブル
ヘッダー付きの表
左揃えヘッダー付きの表
水平/垂直テーブルの見出し
キャプションを含むテーブル
複数の列にまたがるテーブルセル
複数の行にまたがるテーブルセル
セル間隔を持つテーブル
内部のHTMLタグを持つテーブル
id Iを使用して別のスタイルを持つテーブル
ID IIを使用して別のスタイルを持つテーブル
クラスIを使用して別のスタイルを持つテーブル
クラスIIを使用して別のスタイルを持つテーブル

例について説明しました


HTMLリスト

順不同リスト(デフォルト)
ディスクの弾丸と順不同リスト
サークルの弾丸と順不同リスト
正方形の箇条書きと番号なしリスト
箇条書きのない順不同リスト
順序付きリスト(デフォルト)
番号の順序付きリスト
文字と番号付きリスト
小文字と番号付きリスト
ローマ数字と順序リスト
小文字のローマ数字と順序リスト
記述リスト
ネストされたリストI
ネストしたリストII
水平リスト
水平リストメニュー

例について説明しました


HTMLブロックとインライン要素

スタイリング<div>要素
スタイリング<span>要素

例について説明しました


HTMLクラス

、分類<div>要素I
、分類<div>要素II
、分類<span>要素を

例について説明しました


HTMLレイアウト

使用してレイアウト<div>要素を
セマンティックな要素を使用してレイアウト
レイアウト使用して<table>要素

例について説明しました


HTMLのiframe

インラインフレーム(HTMLページの内部フレーム)

例について説明しました


HTMLのhead要素

なしで有効なHTMLドキュメント<html> <body, and <head>
なしで有効なHTMLドキュメント<head>要素
<タイトル>要素は、ドキュメントのタイトルを定義します<title>
<スタイル>要素にはスタイル情報が含まれています<style>
<リンク>要素は、外部リソースへの関係を定義します<link>
<メタ>要素には、特別なメタ情報を定義します<meta>
<スクリプト>要素は、クライアント側のJavaScriptを定義します<script>
<ベース>要素は、すべてのURLのベースURLを定義します<base>

例について説明しました


HTMLスクリプト

スクリプトを挿入
使用<noscript>タグ

例について説明しました


HTMLフォーム

テキスト入力を持つフォーム
ラジオボタン入力を持つフォーム
テキストフィールドと送信ボタンを持つフォーム
name属性のないテキストフィールドを持つフォーム
フォームデータのグループ化
フォームから電子メールを送信

例について説明しました


HTMLフォーム要素

シンプルなドロップダウンリスト
事前に選択された値を持つドロップダウンリスト
テキストエリア(複数行のテキスト入力フィールド)
入力ボタン
使い方<datalist>要素を
使い方<keygen>要素を
使い方<output>要素を

例について説明しました


HTML入力タイプ

入力タイプテキスト
入力タイプのパスワード
入力タイプのラジオ
入力タイプのチェックボックス
入力タイプボタン
入力タイプ番号-制限のあります
入力タイプ番号-ステップで
入力タイプの日付-日付ピッカーで
入力タイプ日-制限付き
入力種類の色-カラーピッカーで
入力タイプレンジ
入力タイプの月
入力タイプ週
入力タイプ時間
入力タイプのdatetime
入力datetime型ローカル
入力タイプの電子メール
入力タイプ検索
入力タイプTEL
入力タイプのURL

例について説明しました


HTMLの入力属性

オートコンプリート属性
NOVALIDATE属性
autofocus_attribute
フォーム属性
formaction属性
formenctype属性
formmethod属性
formnovalidate属性
formtarget属性
高さと幅の属性
リスト属性
minとmax属性
複数の属性
pattern属性
placeholder属性
必須属性
step属性

例について説明しました


HTML5キャンバス

JavaScriptでキャンバスに描きます
lineTo(と線を引きます)
)(円弧と円を描きます
fillText(とテキストを描画します)
strokeText(とテキストを描画します)
線形グラデーションを描きます
円形グラデーションを描きます
)のdrawImage(で画像を描画

例について説明しました


HTML5 SVG

SVGサークル
SVG長方形
SVG角丸長方形
SVGスター
SVGロゴ

例について説明しました


HTML5メディア

バニーを再生
コントロールとクマのビデオを再生します
自動再生とクマのビデオを再生します
コントロールと馬の音を再生します

例について説明しました


HTML5のジオロケーション

ジオロケーションの座標を取得します
ジオロケーションのエラーを処理
地図と地理位置情報を取得します。
グーグルマップスクリプトでジオロケーションを取得します。
ジオロケーションを取得し、位置を見ます

例について説明しました


HTML5ローカルストレージ

永久に名前を保存
永久にカウンターを保存します
1セッションのカウンタを格納

例について説明しました


もっとHTML5例

HTML5のドラッグ&ドロップ
HTML5のアプリケーションキャッシュ
HTML5のWebワーカー
HTML5サーバー送信されるイベント