h5とcss3の新機能は何ですか

青灯夜游
リリース: 2023-01-07 11:46:04
オリジナル
5449 人が閲覧しました

h5 新機能: ドラッグ アンド ドロップ API、セマンティック タグ、オーディオおよびビデオ API、キャンバス API、地理 API、フォーム コントロールなど。 css3 の新機能: 1. RGBA と HSLA、2. text-shadow、3. border-radius、box-shadow、box-sizing など。

h5とcss3の新機能は何ですか

このチュートリアルの動作環境: Windows 7 システム、CSS3&&HTML5 バージョン、Dell G3 コンピューター。

html5 は、Web コンテンツを構築するための言語記述方法です。 HTML5 はインターネットの次世代標準です。 css3 は、css (カスケーディング スタイル シート) テクノロジのアップグレード バージョンです。 HTML5 と CSS3 の新機能を見てみましょう。

CSS3 の新機能:

1. カラー: 新しい RGBA、HSLA モード

2. テキストシャドウ

3 . ボーダー:角丸(border-radius) ボーダーシャドウ:box-shadow

4. ボックスモデル:box-sizing

5. 背景:background-size 背景画像の設定 サイズbackground- origin は背景画像の原点を設定します

background-clip は背景画像のトリミング領域を設定します。「」で区切られ、アダプティブ レイアウト用に複数の背景を設定できます

6. グラデーション: リニアグラデーション、ラジアルグラデーション

7. トランジション: トランジション、アニメーションが実現可能

8. カスタムアニメーション

9. CSS3で導入された唯一の疑似擬似コード要素は次のとおりです:selection.

10.メディア クエリ、複数列レイアウト

11.border-image

12.2D 変換:transform:translate(x, y ) 回転 (x, y) 傾斜 (x, y) スケール (x, y)

13. 3D 変換

CSS3 新しい疑似クラス:

p:first-of-type は、親の最初の

要素である各

要素を選択します。

p:last-of-type は、親要素の最後の

要素である各

要素を選択します。

p:only-of-type 親の唯一の

要素であるすべての

要素を選択します。

p:only-child 親要素の唯一の子要素である各

要素を選択します。

p:nth-child(2) 親要素の 2 番目の子である各

要素を選択します。

:enabled、:disabled フォーム コントロールの無効状態を制御します。

:チェックすると、ラジオ ボタンまたはチェック ボックスが選択されます。

html5 の新機能:

1. ドラッグ アンド ドロップ API

2. セマンティック コンテンツ タグの改善 (header、nav、footer、aside、article ,section)

3. オーディオ、ビデオ API(audio,video)

4. Canvas API

5. Geography (Geolocation) API

6.ローカル オフライン ストレージ localStorage の長期保存データ。ブラウザを閉じてもデータは失われません。

#7. sessionStorage データは、ブラウザを閉じた後に自動的に削除されます

#8フォーム コントロール、カレンダー、日付、時刻、電子メール、URL、検索

9. 新しいテクノロジ Webworker、WebSocket、地理位置情報

プログラミング関連の知識の詳細については、次のサイトを参照してください:

概要プログラミング###! !

以上がh5とcss3の新機能は何ですかの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート
私たちについて 免責事項 Sitemap
PHP中国語ウェブサイト:福祉オンライン PHP トレーニング,PHP 学習者の迅速な成長を支援します!