私はレスポンシブ サイトをコーディングしています。現時点では 2 つの CSS ファイル scree_style.css
を作成しており、以下に説明する中画面screen_layout_medium.css
用のセクションのみの CSS を作成しています。<header>
これが私がそれらをリンクした方法です:
<link rel="stylesheet" type="text/css" href="css/screen_styles.css" />
<link rel="stylesheet" type="text/css" @media="only screen and(min-width:501px) and (max-width: 800px)" href="css/screen_layout_medium.css" />
ヘッダー セクションの css を書いた後screen_layout_medium.css
、ブラウザが全幅であっても、デフォルトのレイアウトとして読み込まれます。
のヘッダーセクションの CSSscreen_layout_medium.css
header { height:200px; background:url(images/banner_medium.jpg) no-repeat 90% 0px;}
header a.logo { width:115px; height:70px; top:20px;right:20px;background:url(images/logo_medium.png) ; }
デフォルトの CSS のスタイル
header { height:275px ; background:url(images/banner_large.jpg) no-repeat right 0px;}
header a.logo {width:150px ; height:85px ; top:28px; right:30px; background:url(images/logo_large.png) no-repeat ; }
デフォルトのレイアウトとしてロードされない理由は何ですかscree_style.css
。助けてください。