WEBプログラミング開発on備忘録~PHP / BootStrap / jQuery / API / iOS

php,css(ブートストラップ),javascriptなどWEBシステムやコンテンツを作りたい自分ようのまとめ

bootstrapブートストラップ

ブートスラップを使ってフォームの入力項目にヒントを薄く表示させる

フォームに入力ヒントを表示させるには、 placeholder="4文字以内の半角英数" みたいなかんじにすればOK Bootstrapのtextareaに注意書きみたいなヘルプを付け加える - Code Log

ブートストラップで小さい項目説明文をポップアップとかホバーとかで出現させる

なんと説明していいかわからないのですが、 トピックというか注意書きというかヘルプというか、 ちょっとした付帯情報を表示するときに、 小さい枠のポップアップで表示させる方法。 BootstrapのPopoverをhoverで使って簡単に項目説明しちゃおう! | シャッ…

BootStrapでジャンボトロンを使う

いままで勘だけでつかってきたブートストラップだけど、 いちど、ちゃんと体系だって勉強したほうがいい気がしてきた・・・ という言葉を以前も言っていたような・・・ ということで(?) ジャンボトロンを使ってみよう。 ↓参考にしたのはこちらのサイト様…

ブートストラップのカラー一覧

bootstrapの色の意味というか、 パターンを一覧に。 そんなに種類もないかと思う。 Bootstrapに用意されているクラス【color編】

ブートストラップのアイコン

ブートストラップで使えるアイコンの一覧があったので、 備忘録しておきます。 アイコン一覧表 ≪ アイコン ≪ コンポーネント ≪ Bootstrap3日本語リファレンス spanタグが長いのでちょっと、 抵抗ありますが、アイコンがシンプルで使いやすそうなので、 結局…

ボタンをつくってみるBootStrap

よくつかうクラスにボタンがあるかと思うので、 備忘録的に記載。 参考にさせていただいたサイト様はこちらです。 Bootstrap サンプル Bootstrapに用意されているクラス【ボタン編】 aタグ等に[btn]クラスをつけて、 各目的ごとにカラースタイルをつけます。…

BootStrapでフォームをレイアウトしてみる

ブートストラップを利用すれば フォームも簡単にキレイなレイアウトになるらしい ってことで使ってみようかと思うけど、 なにげに煩雑な気もする わかりやすいサイト様があったので、参考に。 Bootstrap Form おさらい - Qiita Forms · Bootstrap bootstrap…

BootStrapでテキストや要素を中央ぞろえにする

ブートストラップには、 文字やブロックなどを中央そろえにするクラスが用意されているみたいです。 Bootstrapで左・中央・右寄せする方法 - Qiita Bootstrapの使い方:ブロック中央よせ | CPIスタッフブログ テキストのときは、 text-center ブロックのとき…

モーダル機能をつかってみる

ダイアログのようにモーダル画面を実現したいと思います。 ① Bootstrap サンプル ② Bootstrapのモーダルダイアログやプログレスバーを使ってユーザーにやさしいWebアプリにしよう (1/3):CodeZine(コードジン) ふたつのサイト様を参考にしました。 手順と…

画像の装飾

imgタグを装飾します Bootstrapに用意されているクラス こちらのサイトさまを参考にすると、 class指定で 角丸 img-rounded 丸型 img-circle サムネイル型(枠+影) img-thumbnail ができるようです。

タブで表示切替する

タブをクリックして、コンテンツ内容を切替ます。 参考にしたサイト様はこちら。 http://www4.plala.or.jp/airegin/sample.html# http://hacknote.jp/archives/2034/ http://qiita.com/tonkotsuboy_com/items/15a914f073c8f9bb1344 http://bootstrap3-guide.…

Bootstrap参考おすすめサイト

ブートストラップを使ったり、学習したりしたいときにおすすめのサイト様をまとめています。 Bootstrapのサンプル アラートのサンプル アイコン パネル サンプル

alertを使ってみる

メッセージをだしてみたいと思います。 参考にしたサイト様 https://webnetamemo.com/coding/bootstrap/201702264279 学習したいかたは上記のサイト様をご覧下さい。 以下、自分のための備忘録。 アラートのデザインにするには、 divに.alert + .alert-succ…

tableをレイアウトしてみる

ランキングの表をつくりたくてtableの使い方を調べました。 まだまだ不明なこと多いですが。 参考にしたサイト様 https://webnetamemo.com/coding/bootstrap/2015062126 http://www.atmarkit.co.jp/ait/articles/1403/19/news034_3.html では、備忘録まとめ…

bootstrapのレイアウトの基本を知る

さっそくbootstrapを使っていこうかな、と思います。 今回、参考にさせていただいたのはこちらのサイト様です。 https://webnetamemo.com/coding/bootstrap/20150629450 http://www.tohoho-web.com/ex/bootstrap.html 詳しくは、上記サイト様をご覧いただく…