検索

Safari Technology Preview 161によって導入された新しいHTML要素と属性は、広範囲にわたる注目を集めています。この記事では、進化プロセス、機能、<model></model>要素の将来の開発の方向性について詳しく説明します。 <model></model>

AR, VR, and a Model for 3D in HTML

最初に、

要素のアイデアは、SafariのiOS ARクイックルック機能と統合を強化する必要があります。 ARクイックルックにより、ユーザーは、一部の店舗が採用している仮想トライアル機能など、モバイルカメラを介して3D製品モデルを実際の環境にオーバーレイできます。 <model></model>

WebKitの通訳からわかるように、要素の最初の提案は没入型Web委員会からのものでした。委員会は、仮想現実(VR)と拡張現実(AR)テクノロジーをWebに統合することに取り組んでいます。この提案では、HTMLは、複数のメディアタイプをサポートしている間、3Dコンテンツを直接表示するための宣言的なアプローチがないと述べています。 3Dコンテンツの埋め込みには、通常、スクリプト操作

要素が必要です。これはより面倒です。 <model></model>要素は、他のビジュアルメディアと同じくらい便利にインタラクティブな3Dモデルを埋め込むように設計されています。モデルは、3Dモデリングツールによって動的に作成または生成できますが、サーバーによってスタンドアロンリソースとして提供されます。 <canvas></canvas> <model></model>基本的な例は次のとおりです。これは、

または

要素と同様に使用されています。 <video></video> .usdzや.glbなどの<audio></audio>

要素によってサポートされるファイルタイプは、さらに明確にする必要があります。
<model style="width: 400px; height: 300px"></model>

現在、<model></model>要素の提案案は完全に策定されていませんが、ドキュメントへのモデルの追加、インタラクティブ性の有効化、複数の形式のサポート、代替コンテンツの提供、アクセシビリティなど、将来の開発の方向性を概説しています。解決すべき多くの問題も提案にリストされています。

<model></model>autoplaycontrolsloopなどの提案された属性は、それらをmuted要素に似たものにします。 poster 2018年には、Keith Clarkは、3Dモデルをロードおよびレンダリングするために<video></video>と呼ばれるカスタム要素をプロトタイプしたブログ投稿を公開しました。 2020年、ジョー・メドレーは

コンポーネントを共有し、そのためのホームページを作成しました。

<x-model></x-model>現時点では、<model-viewer></model-viewer>要素の標準化はまだ進行中です。 Appleは、Safari TP 161のリリースを通じてサポートを表明しました。これは、AppleのARテクノロジーに重点を置いていることと一致しています。 Googleも関与していますが、主にWebコンポーネントに焦点を当てています。 AppleとWeb上のARテクノロジーに対するGoogleのビジョンに違いがある可能性があり、それがいくつかの対立につながる可能性があります。

要するに、要素の出現は、Web上の3Dモデルの表示と相互作用の新しい可能性を提供しますが、それらの開発はまだ初期段階にあり、将来の開発は楽しみにしています。 CSSネスティングとCSS相対色の構文をサポートするSafari Technology Previewバージョン162がリリースされたことは注目に値します。

以上がAR、VR、およびHTMLの3Dのモデルの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
CSS Flexbox vsグリッド:包括的なレビューCSS Flexbox vsグリッド:包括的なレビューMay 12, 2025 am 12:01 AM

FlexBoxまたはグリッドの選択は、レイアウト要件によって異なります。1)FlexBoxは、ナビゲーションバーなどの1次元レイアウトに適しています。 2)グリッドは、雑誌のレイアウトなどの2次元レイアウトに適しています。この2つは、レイアウト効果を改善するためにプロジェクトで使用できます。

CSSファイルを含める方法:メソッドとベストプラクティスCSSファイルを含める方法:メソッドとベストプラクティスMay 11, 2025 am 12:02 AM

CSSファイルを含める最良の方法は、タグを使用してHTMLパーツに外部CSSファイルを導入することです。 1.タグを使用して、外部CSSファイルを導入します。 2。小さな調整のために、インラインCSSを使用できますが、注意して使用する必要があります。 3.大規模プロジェクトでは、@Importを介して他のCSSファイルをインポートするために、SASS以下などのCSSプリプロセッサを使用できます。 4。パフォーマンスのために、CSSファイルをマージし、CDNを使用し、CSSNANOなどのツールを使用して圧縮する必要があります。

FlexBox対グリッド:両方を学ぶべきですか?FlexBox対グリッド:両方を学ぶべきですか?May 10, 2025 am 12:01 AM

はい、Youはrelearnbothlexboxandgrid.1)FlexBoxisidealforone-Dimensional、FlexiblleayoutslikenavigationMenus.2)Gridexcelsintwo-digsignssuchasmagazinelayouts.3)Bothenhanceslaysutibulivedibulisunivedivition、floctonsulururを

軌道力学(またはCSSキーフレームアニメーションの最適化方法)軌道力学(またはCSSキーフレームアニメーションの最適化方法)May 09, 2025 am 09:57 AM

独自のコードをリファクタリングするのはどのように見えますか?ジョン・レアは、彼が書いた古いCSSアニメーションを選び、それを最適化するという思考プロセスを歩きます。

CSSアニメーション:それらを作成するのは難しいですか?CSSアニメーション:それらを作成するのは難しいですか?May 09, 2025 am 12:03 AM

cssanimationsArenotintinlentyhardbutrepracticeanderstanding ofcsspropertiesandtimingfunctions.1)

@KeyFrames CSS:最も使用されているトリック@KeyFrames CSS:最も使用されているトリックMay 08, 2025 am 12:13 AM

@keyframesispopularduetoitsversitility andpowerincreatingsmoothcssanimations.keytricksinclude:1)defingsmoothtransitionsbetweenstates、2)AnimatingMultipleProperiessimally、3)3)bendorprefixesforbrows -compativity、4)組み合わせwithjavasfo

CSSカウンター:自動番号の包括的なガイドCSSカウンター:自動番号の包括的なガイドMay 07, 2025 pm 03:45 PM

csScounterSareSareusedTomageautomaticinginginwebdesigns.1)それらは、コンテンツ、リスト、および積極的なものを使用することができます

スクロール駆動型のアニメーションを使用したモダンなスクロールシャドウスクロール駆動型のアニメーションを使用したモダンなスクロールシャドウMay 07, 2025 am 10:34 AM

特にモバイルデバイスでは、スクロールシャドウを使用することは、Chrisが以前にカバーした微妙なUXです。 Geoffは、アニメーションタイムラインプロパティを使用する新しいアプローチをカバーしました。これがさらに別の方法です。

See all articles

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

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

AI Clothes Remover

AI Clothes Remover

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

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

Video Face Swap

Video Face Swap

完全無料の AI 顔交換ツールを使用して、あらゆるビデオの顔を簡単に交換できます。

ホットツール

SublimeText3 中国語版

SublimeText3 中国語版

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

mPDF

mPDF

mPDF は、UTF-8 でエンコードされた HTML から PDF ファイルを生成できる PHP ライブラリです。オリジナルの作者である Ian Back は、Web サイトから「オンザフライ」で PDF ファイルを出力し、さまざまな言語を処理するために mPDF を作成しました。 HTML2FPDF などのオリジナルのスクリプトよりも遅く、Unicode フォントを使用すると生成されるファイルが大きくなりますが、CSS スタイルなどをサポートし、多くの機能強化が施されています。 RTL (アラビア語とヘブライ語) や CJK (中国語、日本語、韓国語) を含むほぼすべての言語をサポートします。ネストされたブロックレベル要素 (P、DIV など) をサポートします。

SecLists

SecLists

SecLists は、セキュリティ テスターの究極の相棒です。これは、セキュリティ評価中に頻繁に使用されるさまざまな種類のリストを 1 か所にまとめたものです。 SecLists は、セキュリティ テスターが必要とする可能性のあるすべてのリストを便利に提供することで、セキュリティ テストをより効率的かつ生産的にするのに役立ちます。リストの種類には、ユーザー名、パスワード、URL、ファジング ペイロード、機密データ パターン、Web シェルなどが含まれます。テスターはこのリポジトリを新しいテスト マシンにプルするだけで、必要なあらゆる種類のリストにアクセスできるようになります。

MinGW - Minimalist GNU for Windows

MinGW - Minimalist GNU for Windows

このプロジェクトは osdn.net/projects/mingw に移行中です。引き続きそこでフォローしていただけます。 MinGW: GNU Compiler Collection (GCC) のネイティブ Windows ポートであり、ネイティブ Windows アプリケーションを構築するための自由に配布可能なインポート ライブラリとヘッダー ファイルであり、C99 機能をサポートする MSVC ランタイムの拡張機能が含まれています。すべての MinGW ソフトウェアは 64 ビット Windows プラットフォームで実行できます。

SAP NetWeaver Server Adapter for Eclipse

SAP NetWeaver Server Adapter for Eclipse

Eclipse を SAP NetWeaver アプリケーション サーバーと統合します。