資格ライフ.COM 

プライベートバンカー・ウエルスマネジメント・ファミリーオフィス・エステートプランニング・資産税の専門家を目指すブログ-TaxAccounting&Financial Planning

レスポンシブWebデザイン

相続税と資産税の専門家 夢をかなえる税理士&CFP です。

当ブログに訪問していただき、ありがとうございます。

税理士のランキングに参加中です。

応援クリックだけを励みに更新しています!

 ↓↓

にほんブログ村 士業ブログ 税理士へ

スマートフォンタブレット端末などが登場して、ホームページを横で見るケースと縦にみるケースがあると思います。

パソコンなど横でみる用にホームページを作ると縦になるとちょっとおかしいですよね。

特にスマホタブレットなど小型のデバイスについては字が小さくなってしまいます。

そこで考えられているのが、デバイスの種類によって見え方が違うような作り方が求められるようです。

そんなこと言われても僕のようなスキルのない人間は困ります。

多少スタイルシートはつかるようになりましたが、あくまでも使う範囲内の知識です。

とりあえずいろいろなHPを参考にしてやってみました。

まず、ホームページのHTMLのMETA情報として次のような記述をしました。

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

これで、スマホタブレットで開いたときに勝手に文字が縮小されないというもののようです。

<link href="stylesheet.css" rel="stylesheet" type="text/css" media="all">

<link href="tablet.css" rel="stylesheet" media="screen and (min-width: 481px) and (max-width: 0px)">

<link href="smart.css" rel="stylesheet" media="screen and (max-width: 480px)">

これで、デバイスの横幅によって読み込むスタイルシートが切り替わります。

そして、スタイルシートタブレット向けにサイドメニューを下に持ってきたり、上のメニューが表示されないように設定しました。

とにかく、これからはタブレットスマホを意識してホームページを作らないといけないようですね。

夢をかなえる税理士&CFPの学ぶlog-相続と相続税なら

税理士さん教えて!相続と相続税の基礎講座

http://www.officenms.co.jp/souzoku/

【SPONSOR LINK】