http://seesparkbox.com/にあるものとよく似たナビゲーション バーで作業しようとしています 。通常、ユーザーがコンピューターのブラウザー ウィンドウでページを表示している場合、ナビゲーションを完全に水平にしたいと考えています。
ただし、ユーザーが狭い幅からナビゲーションを見ている場合 (ナビゲーション バーの行の折り返しが発生する)、ナビゲーション テキストの上に会社のロゴを配置してナビゲーション バーを再フォーマットしたいと考えています。ブラウザのサイズに合わせてテキスト (リンク) のサイズを小さくします。
正しい方向に少しポイントが必要です。簡単な答えがあれば素晴らしいです。私は本当に助けに感謝します.もしあなたが知っているチュートリアルがなければ、私もそれを感謝します.
私はまだcssでかなり新しいです。
% widthで使用media QueryできますFluid layout。
詳細については、これらの記事をお読みください
このような何かがトリックを行う必要があります。これは、3つの幅に基づいて切り替わります。
<link href="mobile.css" rel="stylesheet" type="text/css" media="only screen and (min-width: 0px) and (max-width: 320px)" >
<link href="screen.css" rel="stylesheet" type="text/css" media="only screen and (min-width: 769px)" >
<link href="pad.css" rel="stylesheet" type="text/css" media="only screen and (min-width: 321px) and (max-width: 768px)" >
お役に立てれば！
ありがとう！