2015.12.22
Bootstrap Bootstrap練習問題 練習問題
今回は前回と同様にグリッドシステムを試していこうと思います。 またテーブルを利用したサンプルになっており、２テーブルあります。そしてHTML初心者は困るのですが、長い。。。 長いHTMLも読めるようになるために、サンプルはどんどん長くなる予定です。（これでもまだかなり短いです） サンプルプログラムは …More Read
2015.12.15
Bootstrap Bootstrap練習問題 練習問題
今回はグリッドシステムを試していこうと思います。 前回のテーブルを利用して、グリッドシステムの問題にしようと思います。 Bootstrapのグリッドシステムは馴れると非常に簡単なので、サクッと覚えましょう。 サンプルプログラムはCDNを利用しているので、ローカルに.htmlの拡張子で保存しても動かな …More Read
2015.12.08
Bootstrap Bootstrap練習問題 練習問題
今回はテーブルを試していこうと思います。データを表形式に表示する場合は必ず使います。 情報を整理して出すだけなら、グリッドシステムでも良いのですが、表形式に表示したいという要望はやはり残ります。 システム屋からすると大体tableでどうにか表示する又はDataTablesを利用するといったところでし …More Read
2015.12.01
Bootstrap Bootstrap練習問題 練習問題
Bootstrap(ブートストラップ)は、Twitter社が開発・提供し始めたCSSのフレームワークです。 ※現在は開発者がTwitterをやめて、Bootstrapとなっています。 フレームワークとは、部品を集めたものです。クラス名を指定すれば、簡単に色々な形や色を表現することができます。 ＷＥＢ …More Read
2015.06.03
Bootstrap CSS HTML5 jquery webデザイン サンプル フレームワーク モバイル 基本
Bootstrapで利用できるjQueryプラグイン Layout Bootstrapで簡単に利用可能なjQueryのプラグインをご紹介します。 今回はLayout編です。 レイアウトといっても、テーブルの機能拡張やスクロールの調整など色々なプラグインがあります。 DataTables | Tabl …More Read
2015.05.27
Bootstrap CSS jquery webデザイン サンプル フレームワーク モバイル 基本
Bootstrapで利用できるjQueryプラグイン Animate Bootstrapで簡単に利用可能なjQueryのプラグインをご紹介します。 今回はAnimate編です。 数字をカウントアップするなどの簡単なものなど、ちょっとしたことで見た目に動きをつけられます。 大抵の場合 「必要？」などと …More Read
2015.04.06
Bootstrap CSS jquery Twitter Bootstrap webデザイン サンプル フレームワーク モバイル 基本
Twitter Bootstrap 3 の基本 ボタンのサンプル 今回はボタンの作成をしていきます。１から綺麗なボタンを作成しようとすると、画像を作成しなければならなかったり、JavaScriptを組まなければならなかったり、色々と手間がかかります。 Bootstrapを使用すると、どの程度簡単にな …More Read
2015.04.06
Bootstrap CSS jquery Twitter Bootstrap webデザイン サンプル フレームワーク モバイル 基本
Twitter Bootstrap 3 の基本 フォームのサンプル３ 前回作成したフォームのサイズ変更をしていきます。 基本的にクラスを指定することでフォームサイズの変更ができます。 グリッドシステム同様に、横幅をグリッド数指定で決めることが可能です。 それでは早速サンプルを見ていきましょう。 サン …More Read
2015.03.31
Bootstrap CSS jquery Twitter Bootstrap webデザイン サンプル フレームワーク モバイル 基本
Twitter Bootstrap 3 の基本 フォームのサンプル２ 前回作成したフォームタグを、今回はカスタマイズしていきます。 今回のサンプル 今回作成するサンプルは以下の通り。 フォームのレイアウトを変更する方法 フォームのステータスに応じた表示にする方法 固定値を表示する方法 それでは早速み …More Read
2015.03.31
Bootstrap CSS jquery Twitter Bootstrap webデザイン サンプル フレームワーク モバイル 基本
Twitter Bootstrap 3 の基本 フォームのサンプル HTMLのフォームタグというのは、多種多様なログイン画面や登録画面で使用されています。 今回はこのフォームタグをBootstrapを使って表示するとどのようにUIに変化があるのかをみていきたいと思います。 フォームのサンプル では早 …More Read
