Bootstrap – ブートストラップ

横並びのボックスの高さを揃えて、画像を下揃えにする

Bootstrapで左右幅を決め、左側にロゴ、右側にメニューや電話番号というような配置のヘッダーを作成することが少なくありません。 ヘッダー全体の高さを指定していなければ、左右のいずれかのボリューミーなほうのコンテンツによってヘッダー全体の高さが決まります。 このままだと、左右いずれか、高さの小さい方のコンテンツは上から配置(上揃え)されるのですが、下を揃えたいという場合も少なくありません。 とこ […]

Lightbox for Bootstrap – 名前そのまんまの、サクサクいける Bootstrap4対応の lightboxギャラリー

Bootstrap対応のギャラリースクリプトはいろいろと出てますが、一箇所に「ギャラリー!!」っていうのじゃなくて、ページ内のあちこちに画像が散らばっていて、でも、それらはひとつのグループだから、ポップアップ(モーダル)したときの「前に、後ろに」矢印で、そのページ内の全ての画像をループできるってのを探してたら、良いのを見つけました。 オプションも豊富で、一箇所に「ギャラリー!!」って場合でも重宝し […]

  • 2018.12.17

Bootstrap4でお手軽上下左右中央揃え

中央揃えや下揃えでいろいろと苦労してきたけど、flex 時代になり、なおかつBootstrap4 を使用しているなら、d-flex でいとも簡単にできてしまう。 上下左右中央でこんなcssを書いたりしていましたが [crayon-5e8af560d9363209647494/] Bootstrap4 なら [crayon-5e8af560d9368625641073/] とするだけ。 簡単だわぁ♫ […]

クリッカブルでレスポンシブな日本地図 – Clickable and Responsive Japanese Map

クリッカブルな日本地図を描きたい。とき、日本地図の画像を用意して、都道府県の座標を落としていく、イメージマップを使われてきたのが一般的かと思いますが、イマドキ「Japan Map プラグイン」という jQuery プラグインが用意されていたりします。 Japan Map プラグイン を使って色分けリアルな日本地図 こんなクリッカブルマップが簡単に描けます。 このソースは、コチラ https://t […]

  • 2018.05.20

UnderStrap – 超オススメのブランクテーマ

以前に【Luxeritas】というテーマがイケてるというお話をしました。 こちらは、phpやhtmlを知らない方向け。ダッシュボードからサクサクっとカスタマイズするとき向けのテーマです。 そして、私は、直接子テーマを書き換える時は、この【Lightnig】を使うことがとても多いのです(このサイトもそうです)が 「なーんか他にも良いテーマはないかなぁ」 「Bootstrap 4 にも対応してたらfl […]

  • 2018.03.10

Paste Raw HTML ビジュアルモードのままでソースコードが入力できる

これでしょ♫ 探してたのは   ビジュアルモードで固定ページや投稿の入力をしているときに、「ソースコードを打ち込みたい」とか「Googleのコードを埋め込みたい」とかってありますよね。 いや。あるんです。 それもけっこう頻繁に。   そんなときに、いちいちビジュアルモードとテキストモードを行ったり来たりするのは、非常に効率が悪いんです。ページが長くなると、テキストモードで開いて […]

  • 2017.10.14
  • ,

Bootstrap CDN の使い方

サーバー内にBootstrap関連のソースをダウンロードし&リンクしても良いのですが、サクサクっとBootstrapが使いたいときなど、CDNが便利。ということでBootstrapをCDNで使う場合の手順をメモメモ CSNってなんなのよってのは自分で勉強してください Bootstrapの全てを使用する場合には bootstrap.min.css bootstrap.min.js この2つは必須。 […]

Bootstrap で作ったサイトを見たまんま印刷したいぃぃぃ! を書き直しました

bootstrap系のサイトで「ページの印刷がうまくいかない」のは、ちょいちょいあることで。主に   画像が表示されない ことと カラムレイアウトが乱れる こと   見たまんまに印刷されないのは、Bootstrapのおせっかいによるところが大きいわけで 画像が表示されないばかりか、ご丁寧にURLが印刷される(;´Д`) そして、カラムレイアウトが解除されて、1カラム表示されてし […]

特定のタブを開いてリンクする

Bootstrapでつくったタブ(JavaScript)の、特定のタブを開いた状態でジャンプ(リンク)したい。 けっこうよくあるパターンだと思います。 Bootstrapのタブに直接リンクする方法としてあちこちに書かれてはあるのですが、なかなかうまく働いてくれない。 試行錯誤の上、なんとかうまくいったので、書き留めておきます。 呼び出す側(リンク元) [crayon-5e8af560d9b8404 […]

↑上へまいりま〜す