パソコンアクセス、携帯電話アクセスに対応したホームページを制作します。 _html/css_WEB-ITnose
同社はポータルサイトを開発していますが、PCでアクセスする場合は問題ありませんが、携帯電話に付属のブラウジングボールでアクセスすると、レイアウトに問題があり、レイアウトが非常に悪いです。
私の考えは、ユーザーが携帯電話から Web サイトにアクセスしているのか、PC からアクセスしているのかを判断できるかどうかです。その場合、PC はリッチ レイアウトのポータル Web サイトにアクセスし、携帯電話からは 2 つの処理を行うことができます。合理化されたバージョンの Web サイトにアクセスします。
そうでない場合は、専門家が解決策を教えてくれることを願っています。
ディスカッションへの返信 (解決策)
PC と携帯電話でアクセスするページが 2 セットある必要があります。PC のページには多くのコンテンツが含まれていますが、携帯電話のページは一般に簡素化する必要があります。どのように呼び出して判断するかはプログラマーの問題です。わかりませんが、笑
現在のスマートフォンのブラウザは、基本的に実際の PC ブラウザとそれほど変わりません (速度を除いて)。ページが W3C 標準を満たしている限り、同じように表示されるはずです。
ブラウザを区別する必要がある場合は、各ブラウザに固有の userAgent を確認できます。 userAgent は、クライアント上でwindow.navigator.userAgent
を使用して取得できます。サーバー側では、使用するテクノロジによって異なりますが、通常はドキュメントに記載されています。
現在のスマートフォンのブラウザは、基本的には実際の PC ブラウザとそれほど変わりません (速度を除く)。ページが W3C 標準を満たしている限り、同じように表示されるはずです。
ブラウザを区別する必要がある場合は、各ブラウザに固有の userAgent を確認できます。 userAgent は、クライアント上で
window.navigator.userAgent
今どのブラウザでアクセスしているのかを区別したくないのですが、携帯電話からアクセスしているのか、パソコンからアクセスしているのかを区別したいのです。 UserAgent は、どのブラウザが使用されているかを区別することしかできません。
これは非常に簡単です。異なるレイアウトで 2 つの CSS スタイル シートを作成し、次のようにするだけです。
この原則は、お客様が判断するものではなく、コンピューターまたは携帯電話のブラウザー自体の機能を使用することです。要件に最も適した CSS を自分でチェックするため、携帯電話に適した CSS を指定しないと、コンピューター用のソリューションしか使用できず、理想的な効果が得られません。
このようなことを自分で行う必要はありません。活用する方法を学びましょう。もちろんスマートフォン以外でもWMLなどを使用している場合はWebサイトを変換する必要があります。しかし、あなたはそれらを除外しているようですが、それは正しいことであり、不必要です。
js を使用して判断できます。例: !/((iPhone|iPad|iPod)/i.test(navigator.userAgent) これは Apple ハンドヘルドデバイスかどうかのみを判断します。他のデバイスも判断できます
注意してください
これは非常に簡単です。異なるレイアウトで 2 つの CSS スタイル シートを作成し、次のようにするだけです。
...また、2 つのセットを作成する予定です
たとえば、私のプロジェクトは www.myWebSite にデプロイされます。プロジェクトディレクトリの下には、index.html、computer.html、telphone.html という 3 つの html ファイルがあります。このとき、ユーザーは携帯電話からアクセスするかどうかが決まります。ユーザーが携帯電話から入力する場合は、telphone .html を入力し、コンピューターを入力する場合は、computer.html を入力します。
サーブレット
サーブレット
を入力します。
7階のtheforeverさんからの返信を引用します:
これはとても簡単で、レイアウトの異なるCSSスタイルシートを2セット作成し、次のようにするだけです:
私も2セット作る予定です。
現在の問題は、自動ジャンプを実現することです。
私が言及した 2 つのセットは、あなたが考えている 2 つのセットではありません。
必要な 2 つのセットは、HTML から CSS、さらには画像全体までです。
2 つのセット、CSS だけを意味します。ページはまだ 1 ページなので、ジャンプする必要はまったくありません。デバイスに応じて、当然異なる CSS ソリューションが呼び出されます。ページ レイアウトを整えて CSS を適切に記述すれば、1 つのページでデバイスに応じた 2 つのまったく異なる表示効果が得られます。
プログラムがデバイスを検出してジャンプする方法は、バックグラウンドでもフォアグラウンドでも実装可能です。
しかしその場合、2 つのセットを作成するには時間と労力がかかり、一方の部分が変更されると、もう一方も同時に変更する必要があります。
私の方法は、現在および将来的に最低のコストでそれを達成できるように検討することです。
プログラムがデバイスを検出してジャンプする方法は、バックグラウンドでもフォアグラウンドでも実装可能です。
しかしその場合、2 つのセットを作成するには時間と労力がかかり、一方の部分が変更されると、もう一方も同時に変更する必要があります。
私の方法は、現在および将来的に最低のコストでそれを達成できるように検討することです。
現在の要件では、2 つのアクセスの内容がまったく異なるため、2 つのセットを作成する必要があります。携帯電話からアクセスできるモジュールは「FAQ」と「ソフトウェアダウンロード」の 2 つだけですが、他にもたくさんあります。コンピュータからアクセスできるコンテンツ。最終的には議論の結果、ページ、CSS、画像を含めて2セット作ることに決定しました。
デバイスのジャンプを検出するのは簡単だと上で言いましたが、その方法を教えてください。
モバイルブラウザとPCブラウザがJSを使って差別化された情報を取得できない限り無理です。
そして、ユーザーがインターネットにアクセスするために携帯電話を使用するかコンピューターを使用するかは、厳密に言えば個人のプライバシーです。
注意してください...業界がそれをどのように実装しているかわかりません。たとえば、wap.sina.com
モバイル Web サイトの作り方、専門家が教えてくれます
投稿者が持っているかどうかはわかりませんこの問題は解決しました。私も同じ問題に遭遇しました。PC とモバイルの Web サイトを区別する必要があるだけです。どうすればよいかわかりません。問題が解決した場合は、ありがとうございます。
js は、ナビゲーター オブジェクトで使用されるブラウザのシステム プラットフォームを決定します

ホットAIツール

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

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

Undress AI Tool
脱衣画像を無料で

Clothoff.io
AI衣類リムーバー

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

人気の記事

ホットツール

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

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

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

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

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

ホットトピック









HTMLは、簡単に学習しやすく、結果をすばやく見ることができるため、初心者に適しています。 1)HTMLの学習曲線はスムーズで簡単に開始できます。 2)基本タグをマスターして、Webページの作成を開始します。 3)柔軟性が高く、CSSおよびJavaScriptと組み合わせて使用できます。 4)豊富な学習リソースと最新のツールは、学習プロセスをサポートしています。

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

HTMLはWeb構造を定義し、CSSはスタイルとレイアウトを担当し、JavaScriptは動的な相互作用を提供します。 3人はWeb開発で職務を遂行し、共同でカラフルなWebサイトを構築します。

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

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

Anexampleapalofastartingtaginhtmlis、それはaperginsaparagraph.startingtagsaresentionentientiontheyinitiateelements、definetheirtypes、およびarecrucialforurturingwebpagesandcontingthomedomを構築します。

webdevelopmentReliesOnhtml、css、andjavascript:1)htmlStructuresContent、2)cssStylesit、および3)Javascriptaddsinteractivity、形成、

GiteEpages静的Webサイトの展開が失敗しました:404エラーのトラブルシューティングと解像度Giteeを使用する
