2017-05-04 5 views
-5

私はこのWebサイトで作業しています。応答性のあるデザインのテストを開始するまではすべて動作します。JSフルページのスクロールレイアウトに対する反応の問題

多くのコンテンツがカットされます。ウェブサイトのリンク:http://ciesseprogettazioni.netkom.it/

どのように私はこれを防ぐことができ、どのようにコンテンツを本当に応答性にすることができますか?

私はこのワードプレスプラグインがスクロール可能なセクションごとに100VHを設定するので、高さを設定するためにVHを使用することを考えています。

アイデア?私はそのコンテンツを本当に敏感にするために%ですべてを作るべきですか?

答えて

1

ページの幅が小さくなるうちに消える要素の多くに問題があります。私はあなたのエレメンツのいくつかが身長、幅などを設定していることを一目見てみました(pxで)。応答性を高めるための1つのステップは、em、vh、%などの応答単位を使用することです。

@mediaプロパティを使用して、ウェブサイトのセテン幅での動作をさらに正確にすることもできます。そのためには、あなたのHTMLのheadでこれを使用する必要があります。

<meta name="viewport" content="width=device-width, initial-scale=1" /> 

とあなたのCSSでこのような何か:

@media (min-width: 320px) and (max-width: 567px){ 
    #selector{ 
    css:value;} 
} 

上記の例を画面サイズが間にある一度あなたが欲しいものは何でも変更できます320pxおよび567px

私は一度に1つの問題に取り組み、あなたの質問をマークアップコードで文書化し、それを働かそうとしていることを示唆することをお勧めします。あなたが仕事を取り除かなければ、人々は大いに助けてくれるでしょう。あなたの質問が今立つとおり、私には問題があります。私のためにそれを修正します。

+0

申し訳ありませんが、私はうまく説明していませんでしたが、とにかく非常にありがとうございます。私が知りたいのは、単一の要素についてVHを進めることが良いアイデアであるかどうかである。 – MattB

関連する問題