Html==>>いくつかの古典_html/css_WEB-ITnose

1.CSS オーバーフロー属性

2. タグ

タグはユーザー情報を収集するために使用されます。

1 タイプ属性

さまざまなタイプ属性値に従って、入力フィールドには多くのフォームがあります。これは、テキスト フィールド、チェックボックス、マスクされたテキスト コントロール、ラジオ ボタン、ボタンなどです。

text：テキストエリア
readonly属性：読み取り専用かどうか。
password: パスワード領域、入力したテキストが「*」で表示されます
checkbox: チェックボックス
checked属性: チェックするかどうか;
radio: ラジオボタン;
name属性: 1つの領域に複数のラジオボタンボックスを指定します ラジオ操作
リセット: 現在の

フォーム内のすべてのラベルを初期化状態にリセットします (テキスト領域の内容をクリアするなど)
submit: 現在の フォーム情報を指定されたページに送信します
button: 通常のボタン
Value 属性:ボタンボタンで表示されるテキスト
file:ファイル選択ラベル
hide:隠し領域、ユーザーには表示されないが自分で使用する情報を保存できます
image:画像領域
src属性:画像が保存されるパスを指定します保存されます;
title 属性: マウスを移動したときに画像に表示されるテキスト;

2 例

3. タグ

は、winform のコンボボックスやリストボックスと同様に、単一選択メニューまたは複数選択メニューを作成できます。

1 属性

1)

size

{int}: ドロップダウン リストのサイズを設定します。デフォルトはコンボックス スタイルで、1 より大きい場合はリストボックス スタイルになります。 2) multiple
{boolean}: 複数のオプションを選択するかどうか。複数選択する場合は、Ctrl キーを押しながら左ボタンを押して複数選択操作を実行します。 3) item サブアイテム:

① <

optgroup

> ラベル: 選択されたアイテムのカテゴリを定義します。これは選択できません。 label {string} 属性: カテゴリ表示の名前 title {string} 属性: 選択した項目にマウスを移動すると、表示される情報

② <

option

>Label: オプションの項目を定義します vlaue {string } 属性: 選択した項目の具体的な名前 title {string} 属性: 選択した項目の上にマウスを置くと、表示される情報

2 例

<h3>select标签</h3><select id="province" multiple=multiple size="6" > <optgroup label="直辖市" ></optgroup> <option value="bj" title="北京市" >北京</option> <option value="sh">上海</option> <optgroup label="省市" ></optgroup> <option value="zj">浙江</option> <option value="fj">福建</option></select>

4. 複数行のテキストエリア。テキストエリアのサイズは、cols 属性と rows 属性で設定できます。

1 属性

rows {int}: 表示される行数を示します。

cols {int}: 表示される列の数を示します。

readonly {boolean}: 読み取り専用かどうか。

2 例

5. ラベル

は表示テキストボックスに相当します。

1 {elementID} の属性

: 対応するコントロール ID を関連付けます。このラベルがクリックされると、その ID にバインドされたコントロールがフォーカスを取得します。

6.

タグ

は、winform の groupBox コントロールに似ています。

1.item sub-item

: ヘッダーの名前を示します。

<table> <tr> <td><label for='username'>姓名：</label></td> <td><input type="text" id='username'/></td> </tr> <tr> <td><label for='userpwd'>密码：</label></td> <td><input type="password" id='userpwd' /></td> </tr></table>

2 例

7. ul、ol、li リストタグ

1 はじめに

ul: 順序なしリスト (順序なしリスト)

ol: 順序付きリスト (順序付きリスト))

li : リスト上記の 2 つのリストのサブ項目に基づいて、項目 (リスト項目) が作成されます。

コード例:

rrree

2 属性

type

{string}:

タグの前のシンボル スタイルを定義します。

ul

: タイプは次のとおりです: 円、中空の円、ディスクの実線の円、正方形の実線の正方形、なし: 前に記号なし;

ol

: タイプの特徴: 1: 順序付けされた 1、2、3 を表します。 a、b、c の順序、i: ローマ数字 i、ii、iii。円、円盤、正方形、なしとも定義できますが、実際にはすべて 1、2、3 などの連続です。

8.CSS 表示属性

1 主な値

1) none: この要素は表示されません。

2) block: この要素はブロックレベルの要素として表示されます: 前後に改行があり、占有されます。独自のライン。インライン要素 → ブロック要素 3) インライン: この要素は、インライン要素: 1 の隣に 1 として表示されます。ブロック要素 → インライン要素

2 display:blockデモ

input3
をdisplay:blockに設定

9. CSSのdisplay:noneとvisibility:hiddenの違い

visibility:hiddenは非表示ですが、位置は保持されます。ブラウジング;

CSS 表示:none は存在しないとみなされ、ロードされません。

Overflow 属性値 {visible|hidden|scroll|auto} は、最初に DIV の幅 (width) と高さ (height) を制限する必要があります。どちらも HTML 要素を非表示にし、視覚効果に違いはありませんが、一部の DOM 操作では依然として異なります。

CSS display:none;

この属性を使用すると、HTML要素(オブジェクト)の幅、高さ、その他の属性値は「失われます」;

visibility:hidden;

Afterこの属性を使用すると、HTML 要素 (オブジェクト) は視覚的に見えなくなる (完全に透明になる) だけであり、それが占める空間的位置は依然として存在します。つまり、高さや幅などの属性値も保持されます。

関連ラベル：

Html==&gt;&gt;一些经典

ソース：php.cn

前の記事：CSSを使用してimplement_html/css_WEB-ITnoseを実行したいだけです 次の記事：モバイル淘宝正月グッズ祭りオープニングの龍舞アニメーション_html/css_WEB-ITnose

このウェブサイトの声明

この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

著者別の最新記事

• NullPointerException とは何ですか?どのように修正すればよいですか?
  2024-10-22 09:46:29
• 初心者からプログラマーへ: 旅は C の基礎から始まります
  2024-10-13 13:53:41
• PHP による Web 開発のロックを解除する: 初心者ガイド
  2024-10-12 12:15:51
• C の謎を解く: 新人プログラマーのための明確でシンプルな道
  2024-10-11 22:47:31
• コーディングの可能性を解き放つ: まったくの初心者のための C プログラミング
  2024-10-11 19:36:51
• 内なるプログラマーを解き放つ: まったくの初心者のための C
  2024-10-11 15:50:41
• C で生活を自動化する: 初心者向けのスクリプトとツール
  2024-10-11 15:07:41
• PHP を簡単に: Web 開発の最初のステップ
  2024-10-11 14:21:21
• Python で何でも構築: 創造性を解き放つための初心者ガイド
  2024-10-11 12:59:11
• コーディングの鍵: 初心者のための Python の力を解き放つ
  2024-10-11 12:17:31

最新の問題

function_exists() はカスタム関数を決定できません Function test () {return true;} if (function_exists ('test')) {echo "テストは関数です";

から 2024-04-29 11:01:01

0

3

2183

Google Chromeのモバイル版を表示する方法 こんにちは、先生、Google Chrome をモバイル版に変更するにはどうすればよいですか?

から 2024-04-23 00:22:19

0

11

2330

子ウィンドウは親ウィンドウを操作しますが、出力は応答しません。 最初の 2 つの文は実行可能ですが、最後の文は実装できません。

から 2024-04-19 15:37:47

0

1

1960

親ウィンドウには出力がありません document.onclick = function(){ window.opener.document.write('私は子ウィンドウの出力です');

から 2024-04-18 23:52:34

0

1

1845

CSS マインド マッピングに関するコースウェアはどこにありますか? コースウェア

から 2024-04-16 10:10:18

0

0

1897

関連トピック

詳細>

• Windows がハードディスクのフォーマットを完了できない解決策
• 仮想通貨取引所ランキング
• Python で Print() 関数を使用する方法
• 携帯電話暗号化ソフト
• なぜヒマラヤ人はインターネットに接続できないのでしょうか?
• ビットコインを購入できる場所
• コンピューターが自動的に再起動を繰り返す理由
• Javaでキャリッジリターンを読み取る方法

人気のおすすめ

• URLってどういう意味ですか？
• DOM とはどういう意味ですか?
• 画像サイズを変更する方法
• HTMLでフォントを太字にする方法
• HTML画像のサイズを設定する方法

人気のチュートリアル

詳細>

関連するチュートリアル

人気のおすすめ

最新のコース

• 
  最新の ThinkPHP 5.1 ワールドプレミアビデオチュートリアル (PHP エキスパートになるための 60 日間のオンライン トレーニング コース)

  1422749
• 
  PHP 入門チュートリアル 1: 1 週間で PHP を学ぶ

  4267794
• 
  JAVA 初心者向けビデオチュートリアル

  2531708
• 
  Little Turtle のゼロベースの Python 学習入門ビデオ チュートリアル

  507138
• 
  PHP ゼロベースの入門チュートリアル

  862239

• 
  最新の ThinkPHP 5.1 ワールドプレミアビデオチュートリアル (PHP エキスパートになるための 60 日間のオンライン トレーニング コース)

  1422749 回の学習
• 
  JAVA 初心者向けビデオチュートリアル

  2531708 回の学習
• 
  Little Turtle のゼロベースの Python 学習入門ビデオ チュートリアル

  507138 回の学習
• 
  Web フロントエンド開発の簡単な紹介

  215768 回の学習
• 
  PSビデオチュートリアルをゼロからマスターする

  889278 回の学習

• 
  [Web フロントエンド] Node.js クイック スタート

  7409 回の学習
• 
  海外のWeb開発フルスタックコースの完全なコレクション

  5794 回の学習
• 
  Go言語実践GraphQL

  4894 回の学習
• 
  550W ファンマスターが JavaScript をゼロから段階的に学習します

  691 回の学習
• 
  Python マスター Mosh、基礎知識ゼロの初心者でも 6 時間で始められる

  24520 回の学習

最新のダウンロード

詳細>

ウェブエフェクト

公式サイト

サイト素材

フロントエンドテンプレート

• [フォームボタン] jQuery エンタープライズ メッセージ フォームの連絡先コード
• [プレイヤーの特殊効果] HTML5 MP3 オルゴール再生効果
• [メニューナビゲーション] HTML5 クールなパーティクル アニメーション ナビゲーション メニューの特殊効果
• [フォームボタン] jQuery ビジュアル フォームのドラッグ アンド ドロップ編集コード
• [プレイヤーの特殊効果] VUE.JS 模倣 Kugou 音楽プレーヤー コード
• [html5特殊効果] 古典的な HTML5 プッシュ ボックス ゲーム
• [画像の特殊効果] 画像効果を追加または削減するための jQuery スクロール
• [フォトアルバム効果] CSS3 個人アルバム カバー ホバー ズーム効果

• [フロントエンドテンプレート] 室内装飾クリーニングおよび修理サービス会社のウェブサイトのテンプレート
• [フロントエンドテンプレート] フレッシュカラーの個人履歴書ガイドページテンプレート
• [フロントエンドテンプレート] デザイナーのクリエイティブな仕事の履歴書 Web テンプレート
• [フロントエンドテンプレート] 現代のエンジニアリング建設会社のウェブサイトのテンプレート
• [フロントエンドテンプレート] 教育サービス機関向けのレスポンシブ HTML5 テンプレート
• [フロントエンドテンプレート] オンライン電子書籍ストア モールのウェブサイト テンプレート
• [フロントエンドテンプレート] IT テクノロジーがインターネット企業の Web サイト テンプレートを解決します
• [フロントエンドテンプレート] パープルスタイル外国為替取引サービスウェブサイトテンプレート

• [PNG素材] かわいい夏の要素のベクター素材 (EPS+PNG)
• [PNG素材] 4 つの赤い 2023 卒業バッジ ベクター素材 (AI+EPS+PNG)
• [バナー画像] 歌う鳥と花がいっぱいのカートデザイン春のバナーベクター素材（AI+EPS）
• [PNG素材] 金色の卒業帽ベクター素材（EPS+PNG）
• [PNG素材] 黒と白のスタイルの山アイコン ベクター素材 (EPS+PNG)
• [PNG素材] 異なる色のマントと異なるポーズを持つスーパーヒーローのシルエットベクター素材（EPS+PNG）
• [バナー画像] フラット スタイルの植樹祭バナー ベクター素材 (AI+EPS)
• [PNG素材] 9つのコミックスタイルの爆発するチャットバブルベクター素材（EPS+PNG）

• [フロントエンドテンプレート] 室内装飾クリーニングおよび修理サービス会社のウェブサイトのテンプレート
• [フロントエンドテンプレート] フレッシュカラーの個人履歴書ガイドページテンプレート
• [フロントエンドテンプレート] デザイナーのクリエイティブな仕事の履歴書 Web テンプレート
• [フロントエンドテンプレート] 現代のエンジニアリング建設会社のウェブサイトのテンプレート
• [フロントエンドテンプレート] 教育サービス機関向けのレスポンシブ HTML5 テンプレート
• [フロントエンドテンプレート] オンライン電子書籍ストア モールのウェブサイト テンプレート
• [フロントエンドテンプレート] IT テクノロジーがインターネット企業の Web サイト テンプレートを解決します
• [フロントエンドテンプレート] パープルスタイル外国為替取引サービスウェブサイトテンプレート

福祉オンライン PHP トレーニング，PHP 学習者の迅速な成長を支援します！

私たちについて 免責事項 Sitemap

© php.cn All rights reserved