目次
ディスカッション (解決策) に返信
ホームページ ウェブフロントエンド htmlチュートリアル 初心者さん、Webページを作成する際にWebページの設定に適したサイズはどれくらいでしょうか? _html/css_WEB-ITnose

初心者さん、Webページを作成する際にWebページの設定に適したサイズはどれくらいでしょうか? _html/css_WEB-ITnose

Jun 24, 2016 pm 12:23 PM

このような Web ページのサイズを実現したいと考えています。
デザインされた Web ページ、ユーザーのクライアント解像度が異なる場合、Web ページはそれに応じて調整されます。
自分で Web ページを作成した場合、解像度は正常に表示されますが、他の人のコンピュータでは、背景などが正しく表示されません。画像がタイル状に表示されます。一度表示したら、もう一度半分を表示します


ディスカッション (解決策) に返信

すべての解像度を無効にするには、100 ポイントを使用します。

相対レイアウトを使用する場合、この問題は発生しません

デザインされた Web ページのクライアント解像度が異なる場合、Web ページはそれに応じて調整されます。
jsを使用して解像度を識別して別のスタイルを呼び出すこともできますが、複数のスタイルのセットを記述する必要があるため非常に面倒です
2階と3階で説明したように、パーセントまたは相対レイアウトを使用することをお勧めします。 、「背景」と言いました。画像はタイル表示に 1 回表示され、その後半分が表示されます。」
これは、背景を中央に配置し、その後 1 回だけ表示するだけです。
background:url() center no -繰り返し

現在、多くの Web ページがレスポンシブ レイアウトを推奨しています。次へ

2 つの方法、960 レイアウトまたはレスポンシブ レイアウトを理解できます。

960 レイアウトのデフォルトのページは 960 ピクセルで、広い辺は空白のままです。レスポンシブ レイアウトはすべてパーセンテージで行われます。
レスポンシブ レイアウトは今人気です

レスポンシブ レイアウトを使用して試すことができます

背景画像をタイル表示しないように設定でき、背景画像を背景色に合わせてデザインできます

背景画像を次のように設定できますタイルではなく、背景画像を背景色と一致するようにデザインできます。 一致


初心者、学習者

質問:

csdn フォーラムの Web ページがユーザーの解像度によって変化するのと同じです。
例: 1024*768 と 1280*1024 と比較すると、画像のテキストは大きくなりますが、レイアウトは乱雑ではありません。画像が大きくなったり、小さくなったりするのはなぜですか?私はこのようなことを達成したいだけです

質問:

csdn フォーラムの Web ページがユーザーの解像度に応じて変化するのと同じように。
例: 1024*768 と 1280*1024 と比較すると、画像のテキストは大きくなりますが、レイアウトは乱雑ではありません。画像が大きくなったり、小さくなったりするのはなぜですか?これを実現したいだけです
画像を大きくするか小さくするかをどのように制御しますか?
ピクセルと解像度の関係を理解し​​てください

わかりません。気の毒だと思う! Web開発は初めてです!

コンピューターの画面解像度を変更できます。csdn Web サイトを見ればわかります。どう説明したらいいのかわかりません

比較的適応力があるのは実際には努力が必要です。経験豊富なユーザーではないため、これを最終バージョンとして使用しないことをお勧めします

私の提案は、幅の異なるバージョンをさらにいくつか作成することです。 、js を通じてクライアントを判断し、比較的狭いものを選択します (適切に一桁減らすことができます)
Cookie を記録すると、将来のページはこの Cookie をページ レイアウトの基礎として読み取ることができます
さらに、いくつかのボタンJS の判断エラーを避けるために、顧客が選択できる幅はページ上で予約する必要があります。もちろん、カバー Cookie を手動で調整することもできます

その後、相対的な適応性を課外の宿題として使用して、実現可能な最終的な単一バージョンを開発します

とにかく、私はそうします1 つのバージョンが携帯電話、ノートブック、1080p、4k 画面に同時に適応できるとは思いません...まだです 一部の画面は直立できると言われています

固定幅、中央揃え。 Web ページに背景色を追加します。

初心者には960レイアウトを直接使用する方が安全ですが、レスポンシブレイアウトを学ぶこともできますが、このレイアウトは320から1920までの一連の幅のパフォーマンスを考慮し、部分を非表示にする必要があります。必要に応じて この内容は初心者にとっては確かに要求が高すぎます。

960 グリッド システムを確認できます

解像度を見てください。一般的には 1024*768 です

比較的適応するためには実際には多くの努力が必要です。経験のないユーザーはこれを最終的に使用しないことをお勧めします。バージョン


同意します! ! !
さらに、主要な Web サイトの CSS を見てみると、クソは比較的適応性が高いことがわかります。難しいものはB。

width:100%

質問:

csdn フォーラムの Web ページがユーザーの解像度に応じて変化するのと同じです。
例: 1024*768 と 1280*1024 と比較すると、画像のテキストは大きくなりますが、レイアウトは乱雑ではありません。画像が大きくなったり、小さくなったりするのはなぜですか?このようなことを実現したいだけです
CSS スタイルはパーセンテージを使用するため、ブラウザーや画面サイズに応じて自動的に変更できます。

元の投稿者にブートストラップのソース コードを見て、指示に従ってもらいます。

background:url() center no-re は、画像を並べて表示する問題を解決します。

また、幅: 1100px; ウェブページの幅と高さを相対的に決定します。大きなコンテナ全体に幅を 100% 追加します。解像度がどのように変化しても、Web ページのレイアウトは変わりません。

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

ホット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 顔交換ツールを使用して、あらゆるビデオの顔を簡単に交換できます。

ホットツール

メモ帳++7.3.1

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

SublimeText3 中国語版

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

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

SublimeText3 Mac版

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

初心者向けにミスト ロック キングダムをプレイするためのヒント 初心者向けにミスト ロック キングダムをプレイするためのヒント Jan 28, 2024 pm 03:33 PM

ミストロック キングダムは、プレイヤーが Sons of Fire としてプレイして生き残り、探索できるオープンワールド ゲームです。このゲームは、アクション RPG チャレンジのユニークなエンターテイメントを組み合わせており、プレイヤーに無限の驚きと喜びをもたらします。ゲームでは、プレイヤーはリソース、環境、武器などを探索できます。初心者プレイヤーの中には、ゲームの始め方に興味がある人もいるかもしれません。この紹介と共有では、関連するスタート ガイドをいくつか提供します。フォグ ロック キングダムの初心者向けヒント: 瘴気に包まれた地域の危険度は異なります。探索プロセス中に、マップの新しいエリアが徐々にロック解除され、瘴気に包まれた地域の位置が確認できるようになります。マップは2色で区別されており、青色のエリアは短時間しか進入できず、キャラクターの能力レベルに応じて滞在可能時間も変化する。

アンカーポイントアドベント ノービス十中隊おすすめキャラクター アンカーポイントアドベント ノービス十中隊おすすめキャラクター Feb 20, 2024 pm 02:30 PM

「アンカーアライバル」は、高解像度の美少女 2D をテーマにした 3D ターン制カードゲームです。プレイヤーが探索して体験できる豊富でエキサイティングなキャラクターの組み合わせを提供します。高品質のラインナップの強力な組み合わせが数多くあります。新規プレイヤーは初心者にも気になる初心者向けの強力なキャラは何ですか? 初心者が10連ゴールドを獲得するための選択の参考を見てみましょう! アンカーポイント降臨は初心者向けの強力なキャラです。10連の最初のピックはアリスです。主に単体雷系爆発キャラで、出力も爆発力が高く、初心者にも優しいので選ぶのがオススメです。ゴールド10連は「アリス」+「アンテロープ」の組み合わせがおすすめ アリスはゴールドパイア属性を出力するのに最も適したキャラクターであり、初心者カードプールの他の2キャラクターと比べても少しも強いです。アリスはスペシャルをパスできる

バッチインデントの使い方を学ぶことは、PyCharm 初心者が習得しなければならないスキルです バッチインデントの使い方を学ぶことは、PyCharm 初心者が習得しなければならないスキルです Dec 30, 2023 pm 12:58 PM

PyCharm の初心者向けの必須スキル: バッチ インデントの使用をマスターするには、特定のコード サンプルが必要です。 概要: PyCharm は、開発者の効率向上に役立つ多くの実用的なツールと機能を提供する強力な Python 統合開発環境 (IDE) です。日常のコーディングプロセスでは、コードの形式を整然と美しく保つためにコードをインデントする必要があることがよくあります。 PyCharm が提供するバッチ インデント機能を使用すると、コードを迅速にバッチ インデントし、コーディング効率を向上させることができます。この記事では Py について説明します

エンシェント クラウンの初心者ガイドとゲームプレイの紹介 エンシェント クラウンの初心者ガイドとゲームプレイの紹介 Feb 20, 2024 am 11:20 AM

Crown of the Ancients は、西洋の魔法の冒険をベースにした高品質で戦略的なカード モバイル ゲームです。ゲーム内では秘密の探索、遺跡の冒険、全国選手権などの特別なゲームプレイがあなたを待っています。したがって、初心者プレイヤーがこのゲームをすぐに始めたい場合は、初心者ガイドが不可欠です。今日、編集者が関連するガイドをお届けしますので、見てみましょう。エンシェントクラウンの初心者向けガイド、ゲームプレイ、エリア開放スタイルの概要: 1. ダイヤモンド蓄積フロー:すべてはダイヤモンドを蓄積することに集中しており、村を出てから熱心に働き始めます。メインの魔法の武器、ダイヤモンドを必要とする 3 つのフライホイール アクティビティなどを除いて、その他は無視されます。主にそのうちの 1 つに重点が置かれます。ヒーロー チャレンジには注意を払わないでください。できるだけ多く戦えます。 、そしてそれを強制しないでください。利点: ダイヤモンドを集めるためにいじるだけで、村を出た後、ダイヤモンドを使った最新のアクティビティにすぐにアクセスでき、新しいハードウェア ヒーロー シリーズを入手でき、ダイヤモンドは壊れます。

C 言語と C: 新しいプログラマーにとってどちらが良いか C 言語と C: 新しいプログラマーにとってどちらが良いか Mar 19, 2024 am 08:30 AM

C 言語と C: どちらが新人プログラマーに適しているか 現代テクノロジーの急速な発展の時代において、キャリア開発の一環として、または論理的思考スキルを向上させる方法として、プログラミングを学ぶことはますます人気のある選択肢となっています。数あるプログラミング言語の中でもC言語とC言語はどちらも非常に古典的で代表的な言語ですが、初心者向けのプログラミング言語としてC言語とC言語のどちらを選べばよいか迷う方も多いと思います。では、プログラミング初心者には C 言語の方が適しているのでしょうか、それとも C の方が適しているのでしょうか?具体的なコード例が必要な場合

幻獣パルの入門スキルを早くマスターしよう 幻獣パルの入門スキルを早くマスターしよう Jan 23, 2024 am 08:45 AM

『幻獣パルル』はオンラインマルチプレイヤー対応のオープンワールドサバイバルゲームです。このゲームには生き物を収集するための豊富な方法があり、プレイヤーは戦闘、建設、サバイバルなどのさまざまな探索に参加できます。初心者プレイヤーにとって、ゲームの操作スキルやゲーム内容をマスターすることは非常に重要です。参考までに、初心者向けの戦略のヒントをいくつか紹介します。 1. 基本操作を学ぶ:ゲームを始める前に、移動、攻撃、収集などのゲームの基本操作を学ぶことをお勧めします。これにより、キャラクターの操作をより適切に制御できるようになります。 2. 世界を探索する: 幻獣パルルの世界は非常に広大で、多くの隠された場所やリソースがプレイヤーの発見を待っています。リスクを恐れず、隅々まで探索して幻獣パルを見つけてください。初心者のための簡単なヒント 1. ベースサイトの選択、平坦性を最優先にします。幻獣パルでは、

初心者が仮想通貨を購入する際に最もお得に購入するにはどうすればよいでしょうか?初心者向けのコイン購入に関する詳細なガイド 初心者が仮想通貨を購入する際に最もお得に購入するにはどうすればよいでしょうか?初心者向けのコイン購入に関する詳細なガイド Jan 30, 2024 pm 07:57 PM

初心者がコインを購入する最もコスト効率の高い方法は何ですか?仮想通貨を購入する場合、初心者はより良い利益を得るために次の戦略を採用できます。ターゲット通貨について詳しく学び、研究する、投資用によく知られたコインを選択する、取引には信頼できる取引所を使用する、妥当な予算を設定して定期的に購入する、頻繁な取引を避ける、および衝動的な投資を避け、安全なウォレットを使用して資産を保管し、市場動向に細心の注意を払います。これらのヒントは、初心者が仮想通貨を購入する際により良い投資体験をするのに役立ちます。暗号通貨を購入する前に、基本と市場状況を理解することが重要です。さまざまな通貨の特徴、用途、市場の見通しを理解し、盲目的にトレンドに従うことは避けてください。学習と研究を通じて、より賢明な投資決定を下すことができます。初心者の場合、通常は、評判が良く、よく知られている人気のある通貨を選択する方が安全です。ビット

初心者が世界を征服するために三国志をプレイするにはどうすればよいですか? 初心者が世界を征服するために三国志をプレイするにはどうすればよいですか? Feb 29, 2024 pm 05:40 PM

「三国世界征服」の新規プレイヤーはどのように操作すればよいですか?「三国世界征服」は、プレイヤーが武将のラインナップを組み合わせることができる戦争三国戦略ゲームです。マルチプロフェッショナルなゲームプレイの組み合わせを提供し、開発計画、管理、サンドボックス マップのコンテキストでの戦略と戦略を説明します。要素が満載で、戦略と知恵の競い合いがたくさん含まれています。初心者の多くはまだ操作方法に興味があります。今号では、初心者向けのヘルプを共有します!初心者が世界を征服するための三国志 1. 兵力の強化 十分な兵力は資源の確実な獲得と発展の基礎です 兵力を成長させ続けるためには、次の点に注意する必要があります。建物と将軍: 建物と将軍のレベルをアップグレードすることで、軍事力を大幅に強化できます。技術研究: ユニットの攻撃力と防御力を向上させるために、タイムリーに技術を研究します。ダンジョンを征服する:ダンジョンバトルに参加して豊富なアイテムを獲得します

See all articles