CSSフレームワークがすごく便利という話を教えてもらいました。今更ですがCSSフレームワークって使ったことなかったのでちょっと調べてみてVisualforceページで試してみました。
とりあえず参考になったサイトです。
非デザイナにオススメのCSSフレームワーク6選
http://javatechnology.net/other/css-framework/
このサイトからリンクできるはじめてのBootStrapインストール(導入)手順を参考に試しています。
はじめてのBootStrapインストール(導入)手順
http://javatechnology.net/other/bootstrap-install/
サンプルソースやCSSフレームワークのサイトが紹介されていてすごく勉強になりました。
まずは一番基本になると思われるBootStrapをVisualforceで試してみました。
サンプルソースです。
この画面を表示させるには静的リソースに必要なファイルをアップロードしておく必要があります。
これで次の画面を表示できます。
タブ部分のJavaScriptが動作していないなど細かい箇所が上手くいっていませんが、ひとまずそれらしい画面を表示することができました。
ちなみにSalseforceのヘッダーや標準のStyleSheetを無効にしないと標準で使用しているCSSに影響を与えてしまうことがあるみたいです。
試しにその辺を有効にしてみたのがこちらです。
わかりやすい箇所でボタンのCSSが反映されていません。
今回はシンプルな画面ですがもっと複雑になるといろいろ問題が発生しそうです。
とりあえずCSSフレームワークとBootStrapについて入門的な部分については確認できたと思うので良かったです。
