DIV+CSS 基礎トレーニング_html/css_WEB-ITnose
よく使用されるタグ 基本タグ
HTML ドキュメントを作成します
ドキュメントのタイトルや Web ページに表示されないその他の情報を設定します< ;title>< ;/title> ドキュメントのタイトルを設定します;/a&g t; ハイパーテキストリンクを作成します
テーブルタグ
label フォームを作成します
action="..."データを受信するサーバーの URL
method="..."HTTP メソッド (get、post)。このうち、get は非推奨です
Create ドロップダウン メニュー
テキスト ボックス領域を作成します。列数によって幅が設定され、行数によって高さが設定されます
ラベルの後ろにテキストを含むチェック ボックスを作成しますロゴの後ろにテキストを含むラジオ ボタンを作成します
行テキスト入力エリア、サイズ設定 送信ボタンを作成します
リセットボタンを作成します
名:
姓:
ユーザー:
< input type="text" name="user">
Password:
いいね自転車:
車が好きです:
< ;input type="checkbox" name="Car">
男性:
女性:
名前:
メール:
Content:
<入力タイプ="text" name="comment" value="yourcomment" size="40">
よく使用されるスタイル フォント属性: (font)
sizefont-size: x-large;(特大) xx-small; (非常に小さい) 中国語では通常は使用されません。単位: PX、PD
行の高さ: 標準 (標準) 単位: PX、PD、EM
フォントの太さ: 太字。 ) 通常; (通常)
テキスト装飾を変更します: 下線 (下線) 上線; 取り消し線 (点滅)
ブロック属性 : (ブロック)
justify;(両端揃え) left;(左揃え) right;(右揃え) center;(センター)
indent text-indent: value px;
垂直配置 -align:baseline;(ベースライン) sub;(添え字) super ;(添え字) トップ; テキスト - ボトム;
空白: pre;(改行ではない)
幅:; margin:; 順序: 上、右、下、左
パディング:10px 8px 7px;
ボーダー属性: (ボーダー)点線; 破線; 二重線; 溝付き; 凸部; 境界線の幅:; :#;
略称メソッド border: 10px Solid #fff;
スタイル継承
親タグにcssを定義し、子タグに子に続くcssを定義 スタイルがない場合は親のスタイルを継承しますstyle 子タグがある場合、親タグのスタイルをオーバーライドします。
border 属性、Padding (filler)、Margin (border)、background および Border プロパティは継承できません。 。
スタイルは近接性の原則に従います
スタイル分類
インラインスタイルを使用しないでください。絶対に必要な場合を除き、インラインスタイルを使用しないでください
ボックスモデルのインライン要素と要素
block(ブロックの特徴)要素:①常に新しい行で開始します。
②高さ、行の高さ、マージンとパディングはすべて制御できます。
③幅を設定しない限り、幅はコンテナのデフォルトの 100% になります。 。
④ インライン要素とその他のブロック要素を収容可能
インライン要素の特徴:
①とその他の要素はOn 1 行;
②高さ、行の高さ、マージン、パディングは変更できません
③幅はテキストまたは画像の幅であり、変更できません
④インライン要素にはテキストまたは他のインライン要素のみを収容できます
例: < ;a>
初期のアイデア:
1. 各ブロックレベルの要素には、固定された一意の ID があります
2.レベル関数モジュールは CSS スタイル シートを独立して使用します
3. 共通属性はクラスを通じてパブリック スタイル シートから呼び出されます
4. 背景画像の使用を最小限に抑えます
5. 非 W3C 標準タグやスタイルの使用を減らします

ホットAIツール

Undresser.AI Undress
リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover
写真から衣服を削除するオンライン AI ツール。

Undress AI Tool
脱衣画像を無料で

Clothoff.io
AI衣類リムーバー

AI Hentai Generator
AIヘンタイを無料で生成します。

人気の記事

ホットツール

メモ帳++7.3.1
使いやすく無料のコードエディター

SublimeText3 中国語版
中国語版、とても使いやすい

ゼンドスタジオ 13.0.1
強力な PHP 統合開発環境

ドリームウィーバー CS6
ビジュアル Web 開発ツール

SublimeText3 Mac版
神レベルのコード編集ソフト(SublimeText3)

ホットトピック











公式アカウントのWebページはキャッシュを更新します。これはシンプルでシンプルで、ポットを飲むのに十分な複雑です。あなたは公式のアカウントの記事を更新するために一生懸命働きましたが、ユーザーはまだ古いバージョンを開くことができますか?この記事では、この背後にあるtwist余曲折と、この問題を優雅に解決する方法を見てみましょう。それを読んだ後、さまざまなキャッシュの問題に簡単に対処でき、ユーザーが常に新鮮なコンテンツを体験できるようになります。最初に基本について話しましょう。それを率直に言うと、アクセス速度を向上させるために、ブラウザまたはサーバーはいくつかの静的リソース(写真、CSS、JSなど)やページコンテンツを保存します。次回アクセスするときは、もう一度ダウンロードすることなく、キャッシュから直接検索できます。自然に高速です。しかし、このことは両刃の剣でもあります。新しいバージョンはオンラインです、

この記事では、ブラウザのユーザー入力を直接検証するために、必要、パターン、MIN、MAX、および長さの制限などのHTML5フォーム検証属性を使用して説明します。

記事では、HTML5クロスブラウザーの互換性を確保するためのベストプラクティスについて説明し、機能検出、プログレッシブエンハンスメント、およびテスト方法に焦点を当てています。

この記事では、CSSを使用したWebページへの効率的なPNG境界追加を示しています。 CSSはJavaScriptやライブラリと比較して優れたパフォーマンスを提供し、微妙または顕著な効果のために境界幅、スタイル、色を調整する方法を詳述していると主張しています

この記事では、HTML&lt; Datalist&GT;について説明します。オートコンプリートの提案を提供し、ユーザーエクスペリエンスの改善、エラーの削減によりフォームを強化する要素。

この記事では、html&lt; meter&gt;について説明します。要素は、範囲内でスカラーまたは分数値を表示するために使用され、Web開発におけるその一般的なアプリケーション。それは差別化&lt; Meter&gt; &lt; Progress&gt;およびex

この記事では、html5&lt; time&gt;について説明します。セマンティックデート/時刻表現の要素。 人間の読み取り可能なテキストとともに、マシンの読みやすさ(ISO 8601形式)のDateTime属性の重要性を強調し、Accessibilitを増やします

この記事では、HTML&lt; Progress&gt;について説明します。要素、その目的、スタイリング、および&lt; meter&gt;との違い要素。主な焦点は、&lt; Progress&gt;を使用することです。タスクの完了と&lt; Meter&gt; statiの場合
