Just another WordPress site
レスポンシブルデザインのＣＳＳはもととなるベース用のＣＳＳを基準にして、スマホ、タブレットは変更したい要素にたいしてのみＣＳＳを再設定して書き換える。書き換えなければベース用ＣＳＳがが適用される。
ベース用
<link rel=”stylesheet” href=”ベースのＣＳＳファイル名”>
タブレット用
<link rel=”stylesheet” href=”タブレットのＣＳＳファイル名” media=”only screen and (min-width:600px) and (max-width:979px)”>
スマホ用
<link rel=”stylesheet” href=”スマホのＣＳＳファイル名” media=”only screen and (max-width:599px)”>
h1などの要素の中にあるimgのaltに入力した文字はh1などと同様になる。
IE ではjscrolpan が上手く働かなく、feedが表示されない。他のブラウザでは大丈夫。
なので、別の方法を使う。
http://atokala.com/blogs/vertical-scrollbar/
タブレットやＰＣの画像を挿入しているが、スマホではその画像を共通として使えない場合は、これが良い方法なのか分からないが、その画像のimg要素をdisplay:none；にしてその要素の親コンテナでＣＳＳで背景画像で設定してみたらいいかも。
求めるカラム幅 ÷ 親要素の幅 × 100％
小数点以下も記載出来る。
600px ÷ 960px × 100% = 62.5%
BIGLOBEのWiMAXに加入したが、送られてきたホームルーターのWM3450RNの速度がでない。 ベストフォートだから？
チェッカー http://kakaku.com/bb/article/wimax/speed/
上り2.6mbps 下り0.1Mbps
BIGLOBEに問い合わせたがそっちでは管理画面のように変更することができるツールはないと言われ、Atermのサイトを参照してくれとのこと。Atermのサイトにアクセス
http://121ware.com/aterm/ に
無線が不安定なので、無線チャネルの変更を行いたい とあったのでこれを参照。
チャンネルを変更したらスピードが変わった。
上り3.8mbps 下り1.4Mbps （でも測り直したら速度落ちた。ベストフォートだから？）
■変更の仕方
ブラウザにAtermを使ってアクセス 192.168.0.1 と このまま数字のみ入力すると管理画面へ。
ユーザー名は、「admin」です。
パスワードは、 karinamato
192.168.0.1は IPv4デフォルトゲート。ちなみに この 192.168.0.1 はブラウザに繋がっているＰＣのＩＰ番号。IPの調べ方は https://121ware.com/aterm/regist/qa/qa/00263.asp
こちらのサイトも参照した。http://bbs.kakaku.com/bbs/-/SortID=15180769/
なお、WiMAXではプリンタ印刷は出来ないので、ネットから何かを印刷したい場合は、他のアクセスポイントを利用する。
バックグラウンドの画像をレスポンスビリティwebデザインで揃えようとすると大変なので主要画像となる部分は画像を挿入して対応すること
ゲスト出演した時は画像が送られてくるのでその画像をyoutubeに上げる前のバック画像として使用する。
box-sizing: border-box;について…
borderの幅とコンテントの幅をあらかじめ決めておいた幅内にリサイズしてくれるもの
IE9をインストールしたときに、既定のメディアプレーヤーとしてQuickTime Playerが優先がされないよう にしていた設定がリセットされたようです。 ［スタート］メニューを開き「既定のプログラム」－「プログラムのアクセスとコンピューターの既定の設定」で「カスタム」を開き、「既定のメディアプレーヤーを選択してください」のラジオボタンで「Windows Media Player」を選択。 を実行したところ、IE9インストール前と同じようにWebページのMIDIやMP3の音がでるようになりました。
max-width:100%; にすると最大値はオリジナルの横幅以上にはならない
いろいろな考えかたがあるようなのだが、とりあえず
html5 css3ステップアップガイドのchapter6 にならい
ＰＣ 900px
タブレット 600 ～ 899px
スマホ 599px
ｐｃ用は固定スタイルでタブレットとスマホはりキットレイアウトで組む
（スマートフォンサイトのhtml5 css3 p34）
レスポンシブルweb デザインにおける、画像下の余白は、html5では画像がベースラインに揃えて表示されることから画像下に余白が入る。この余白を削除するためには img要素に
vertical-align:bottom を指定する。
body に 左右10pxのmarginと各コンテイナーの左右にmargin autoにするとセンタリングになるらしいが、ipad3ではどうしても右側にだけ余白ができる。たぶん、メディアクエリの幅がいまは
media=”only screen and (min-width:768px) and (max-width:949px)”としていてipad3の解像度はもっと大きいからかも？
naviのコンテナに
text-align: left; がされていなかった。
埋め込みコードをレスポンシブWebデザインでも利用できるように変換してくれるサービス「Embed Responsively」
予めGoogle マップなどで取得したコードをペースト、ボタンを押すだけでコードを書きだしてくれますので簡単！
書き出されるコードはスタイルシートも一緒になっていますのでご注意を…
※マップの大きさがデバイスによって縮小されるのではなく、widthがちょうどよい大きさにカットされるようなイメージだ
いろんな物が出ているが、レスポンシブルするといっても縮小するわけではなく、トリミングされる。 内包するコンテナをwidth: 100%; text-align: center; とする。マーカー複数ある場合、ふかんでみて全部入るSTART_ZOOM値に設定しなければマーカー切れてしまう。
<script type=”text/javascript” src=”http://maps.google.com/maps/api/js?sensor=false”></script>
<script type=”text/javascript” src=”<?php bloginfo(‘template_directory’); ?>/js/gmap.js”></script> <script type=”text/javascript”> function initialize(id){gmap_initialize(id);var data = new Array(); data.push({position: new google.maps.LatLng(36.6919133,136.9852728), title: ‘チャンスメーカー本社’, content: ‘チャンスメーカー本社 <br/>高岡市戸出市野瀬790番地’}); data.push({position: new google.maps.LatLng(36.656766, 137.240868), title: ‘富山事務所’, content: ‘富山事務所 <br/>富山県富山市本郷30番地6’}); data.push({position: new google.maps.LatLng(36.720227,136.981774), title: ‘製作部’, content: ‘製作部 <br/>富山県高岡市辻73-2’}); setMarkerData(data); } </script>
<script language=’JavaScript’> window.onload=function(){initialize(‘gmap_canvas’)} </script> <div id=”gmap_canvas”> </div>
↓desktop/webコンテンツツール/gmap.v3.jsにある。
■gmap.v3.js
これ使えば大丈夫。new-chance/profileで実装中 複数マーカー設置する際に使用。緯度経度の設定あり。
http://arayu.jp/googlemap.html gmap.v3.jsには以下の機能が盛り込まれております。
※このときに下記の
の箇所の通りひと記述する必要あり。
ヘッダに
<script language=’JavaScript’>
window.onload=function(){init()}
</script>
と記載してください。
もちろんinitを別にかかず、無名関数に冗長に書いても結構です
例 googlemapの場合
ヘッド内に
<script type=”text/javascript” src=”http://maps.google.com/maps/api/js?sensor=false”> </script>
<script type=”text/javascript”>
function initialize(id){ var data = new Array(); data.push({position: new google.maps.LatLng(36.732113,137.082951),title: ‘まさはしＦＰ家計相談所’, content: ‘<p ><img src=”./image/top/thumb.jpg” ><br/>まさはしＦＰ家計相談所<br/>富山県射水市本開発808<br/>0766-50-1503</p>’}); var map = viewGoogleMap(id,null,data); } </script>
<script src=”./js/gmap.js” type=”text/javascript”></script>
<script language=’JavaScript’>
window.onload=function(){initialize(‘gmap_canvas’)}
</script>
bodyに
<div id=”gmap_canvas” style=”width: 600px; height: 270px;”></div>
<script type=”text/javascript” src=”http://maps.google.com/maps/api/js?sensor=false”> </script>
<script type=”text/javascript”>
function initialize(id){ var data = new Array(); data.push({position: new google.maps.LatLng(36.732113,137.082951),title: ‘有磯正八幡宮’, content: ‘<p>有磯正八幡宮<br/>富山県高岡市横田町３丁目１番１号<br/>TEL: 0766-22-0344</p>’}); var map = viewGoogleMap(id,null,data); } </script>
<script src=”./js/gmap.js” type=”text/javascript”></script>
<body onLoad=”initialize(‘gmap_canvas’)”> <div id=”gmap_canvas” style=”width: 768px; height: 380px;”></div> </body>
■css
#gmap_canvas p {font-size: 12px; color: #333;}
※ gmap.jsが必要
ゼロが入る列を文字列にする
数字を入れる。 0001
セルの右下の+をしてへドラッグ
書式のセルの書式設定 標準 範囲ドラッグコピー
例えばgoogleﾄﾞﾗｲﾌﾞのセルへ入れる時は
shishikonのドライブ共有になっているデーターの
すでに入力してある0の入っているセルの書式のみ（どうやったかわからん）をコピーして入力範囲内で書式のみペースト。エクセルの文字列になっている数字を値のみペースト
セルに対して 特殊貼り付け 値のみ
279÷310×100 。。。。。90％
=279/310*100
母集団を分母、子集団を分子に置きます。
分母に大きい数、分子に少ない数を持ってくればたいていのものは％になります。
パーセントから元の値を求めるには
どういう計算式になりますか？
たとえば元の数字の30％が50だった場合
元の数字はいくつになりますか？
元の数字の30％が50ですから、
元の数字×0.30＝50
元の数字を求めるには、
①数学のやり方
元の数字×0.30＝50の両辺を0.30で割ります。
元の数字＝50÷0.30
元の数字＝166.6・・
②算数での一つのやり方
元の数字×0.30＝50をみて、
易しい例を考えます。
例えば、2×3＝6
すると、2は、6を3で割ればいいと分かります。
それで、元の数字を求めるには、50を0.30で割ればいいと分かります