cssフレームワーク skeletonで雛型作成
趣味のサイト作成にcssフレームワークのskeletonを使ってみることにしました
Bootstrapも触ってみたいなと思いつつ個人のサイトでは持て余しそうなので・・・
skeletonは非常にシンプルで必要最小限の機能だけ提供してくれます
構成はヘッダ、メニュー、メインコンテンツ、サイドメニュー、フッターという定番のやつ
サンプル
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>サンプルページ</title> <meta name="description" content=""> <meta name="author" content=""> <meta name="viewport" content="width=device-width, initial-scale=1"> <link href="http://fonts.googleapis.com/css?family=Raleway:400,300,600" rel="stylesheet" type="text/css"> <link rel="stylesheet" href="./css/normalize.css"> <link rel="stylesheet" href="./css/skeleton.css"> </head> <body> <div class="container"> <div class="row"> <div class="eight columns"><h1>サイト名</h1></div> <div class="two columns">atom</div> <div class="two columns">rss</div> </div> <div class="row"> <ul> <li style="display:inline-block;padding:5px;">メニュー1</li> <li style="display:inline-block;padding:5px;">メニュー2</li> <li style="display:inline-block;padding:5px;">メニュー3</li> <li style="display:inline-block;padding:5px;">メニュー4</li> </ul> </div> <div class="row"> <div class="nine columns"> <section> <div> <h5>タイトル</h5> <div>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゆよらりるれろわをん・・・</div> </div> <div> <h5>タイトル</h5> <div>あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゆよらりるれろわをん・・・</div> </div> </section> </div> <div class="three columns"> <aside> <h5>サイドメニュー</h5> <div> <ul> <li>サイドメニュー1</li> <li>サイドメニュー2</li> <li>サイドメニュー3</li> </ul> </div> </aside> <aside> <h5>スポンサーリンク</h5> <div> </div> </aside> </div> </div> <div> <div class="twelve columns">フッター</div> </div> </div> </body> </html>
サンプル
http://retro.kansai-fan.com/sample1.html
サンプル(ボーダー付)
http://retro.kansai-fan.com/sample2.html
normalize.cssとskeleton.cssを読み込めばあとはルールに従ってマークアップするだけ
グリッドは12カラムの構成
全体のdivのclassに”container”を指定、その子要素のdivに”row”を指定
その子要素を3カラムと9カラムにしたいならclassに"three columns"と"nine columns"を指定したdivを追加するだけ
グリッドレイアウトが非常に簡単に作成できました
サイト特有の装飾は独自のcssを作ればよいかと
Apache Commons StringUtilsのisEmptyとisBlankの違いをふと調べてみた
長年使い続けているStringUtilsのisEmptyとisBlankの違いを今更ながら調べてみました
Apache Commonsのサイトからソースをダウンロードして確認したところ
isEmpty
public static boolean isEmpty(final CharSequence cs) { return cs == null || cs.length() == 0; }
引数の文字列がnullか長さが0なら空と判定されます
trimしてないのでスペースが含まれる場合等は空と判定されません
isBlank
public static boolean isBlank(final CharSequence cs) { int strLen; if (cs == null || (strLen = cs.length()) == 0) { return true; } for (int i = 0; i < strLen; i++) { if (!Character.isWhitespace(cs.charAt(i))) { return false; } } return true; }
引数の文字列がnullか長さが0なら空と判定されるのはisEmptyと同じです
その後に一文字ずつisWhitespaceで空白が含まれているかどうか判定してますね
スペースはisWhitespaceで空白と判定されます
DBの主キー等の必須項目のチェックにはisBlank
システム的に半角スペース等の空白のみが入ることのない文字列の空文字判定にはisEmptyでしょうかね
2018/03/05 母校(近畿大学)のオープンキャンパスに潜入
電車の中吊り広告に母校、近畿大学のオープンキャンパスの情報を発見
予約不要、入場も無料とのことなので暇つぶしも兼ねて参加することに
卒業後に資格試験で訪れて以来10数年ぶりです
足しげく通ったお店ははどうなっているのか
長瀬駅を降りてまなびや通りを通ってキャンパスへ向かいます
キャンパスから遠いけど時間に余裕のある時に通ってた御用は健在
そばと丼ぶりのセットをよく食べてました
今回お昼は学食でぶり丼食べると決めてたのでまた日を改めて懐かしの味を楽しみたいと思います
ワンプレイ20円のゲーセン、UFOは閉店
この辺りにあったと思いますが・・・
たまに古本買ってた本屋さん
中のレイアウトは当時のまま
レジの奥でおばちゃんが座ってテレビみてるのも当時のまま
ザ・ワールド並みに時が止まってる感じです
このお店も当時からあったと思います
行ったことないけど
ここでちょっと裏通りにむかいます
おそらく大学4年間で一番通ったであろう裏王があった場所
昼間はチャーハンか天津飯のほの2択、それ以外を頼むとたいてい「昼はやってへん」と言われる
チャーハンが300円、大盛で400円、天津飯が350円くらいだったかな?
天津飯大盛と言って、天津飯の大盛はないと言われ恥ずかしい思いをした裏王
だいぶ前に閉店したようです・・・
近大出身のボクシングで有名な方がお勧めしてたので行ったけど自分の口には合わなかったカロリー
この辺りには1階でゲーム、2階で古本を売ってるお店があったけど閉店したようです
宇宙刑事シャリバンの中古VHSを発見し思わず買ってしまった思いで深いお店だったのですが・・・
閉店したと聞いていたあうとばあん
この日は休業日だっただけで営業はしてるようです
怒首領蜂とKOF99をよくプレイしてました
こちらはオープンキャンパスでもらったもの
所々当時のままの建物もあったけど新しい施設ができたり格段に綺麗になってました
今の時代に学生生活送ってる子達に嫉妬しまくり
こちらは帰宅途中によった布施駅近辺
今更Androidアプリ開発 Android Studioの導入と日本語化
今更ながら勉強もかねてAndroidアプリの開発を始めることにしました。
なにはともあ開発環境、ということでAndroid Studioを導入。
慣れ親しんだeclipseでもいいかなとは思いましたが、Android Studioが主流になりそうかなと思いまして。
インストール直後は英語です。
preadesの日本語化プラグインをインストールすれば問題なく日本語化できました。
Eclipse 日本語化 | MergeDoc Project
ダウンロードしたzip ファイルを解凍して setup.exe でインストーラーを起動。
Android Studioの実行ファイルを選択するだけで後は自動で日本語化してくれます。
HP Spectre 13 は高級感が漂い所有欲を満たすが・・・
2017年の年末
もう少し経費を使って税金対策しようとノートパソコンの購入を検討
用途はドキュメント作成、ネットサーフィン、プログラミング等
MacBook等も検討しましたが、最終的には第8世代CPUを搭載したHPのSpectre 13を購入しました
HP Spectre 13(2017年11月モデル)製品詳細 - ノートパソコン | 日本HP
スタンダードモデルとパフォーマンスモデルがありますが、迷うことなく性能の高いパフォーマンスモデルを選択
CPUがCore i7-8550U 、メモリが16GB、SSDが512GBとなかなかのスペック
第8世代CPUは4コアになり性能がかなりアップしたとの評判なので期待大です
年末に注文して1月10日に到着
専用化粧箱に梱包されてます
なかなかの高級感
本体以外にマニュアル、専用スリーブケース、速効!HPパソコンナビ特別版
こちらは年末年始特別キャンペーンの特典のHP Spectreマウス
他に液晶保護フィルムも特典としてもらえました
ホワイトにアクセントのゴールド
個人的には全モデルのブラックが好きなのですが・・・
女性はホワイトのほうが好みなのでしょう
ACアダプタとUSB A 変換アダプター
Spectre 13のUSBはタイプCなので通常のUSBを使うために変換アダプターが標準で添付されているのはありがたいです
10.4mmなのでかなり薄いです
3年ほど使用していたLaVie Zの上に載せてみました
LaVie Zは高さ14.9mm、なので薄さはSpectre 13の勝ちです
一方重さはLaVie Zが795g、Spectre 13は1.11 kgなのでSpectre 13のぼろ負け・・・
しかし、持ってみると数値ほどの差を感じないので携帯するのも苦にならないかと
Spectre 13は側面に端子類がなくすべて背面にあります
薄さ実現のためなのでしょう
少し不便ですが個人的には妥協できるので問題なし
ディスプレイはIPSタッチディスプレイでタッチ操作も可能です
光沢液晶なので画面への映り込みが多少きになるところです
まあまあうちやすいキーボードですが・・・
LaVie Zとキーの配置が違いすぎてなれるまでに時間がかかりそうです
fnキーとctrlキーが逆な点、右端にhome、pg up、pgdn、endが縦に並んでるのが使いにくい
ここが一番不満な点です
PCMARK10でベンチマークを実施
たぶん悪くない結果なのでしょう
オンラインで相対スコアをみてみました
ゲームするのはきついけど通常利用には十分すぎるスペックではないでしょうか
使い始めて数週間、キーボードの配置以外は非常に満足しています