[Bootstrap]Carouselのカスタマイズ

Bootstrap のスライドショー Carousel(カルーセル) を設置する機会があると思います。画像の上に文字入れ(キャプション)をする事もあるでしょう。レスポンシブでも伝わるキャプションのカスタマイズをご紹介しま…

[Bootstrap] 初心者に! Bootstrap テンプレート集 

初心者にはBootstrapをお勧めしています。個人的な感想では、レスポンシブサイトを作る際に基本的な事さえ覚えれば、一番ミスが少なく構築できると思います。確かに<div>が多くなるなど、嫌いな方も少なくあり…

[CSS]レスポンシブで見やすいtable(表)

Tableで作った表を小さなデバイスで見るのって大変ですよね。画面を横にしてみたり画面を広げてみたり。 CSSで見やすい表にする事が出来ます。Bootstrapの様な@mediaでレスポンシブ対応の設定がなされら、とても…

[Bootstrap] ブレークポイント @media

レスポンシブのブレークポイント(Responsive breakpoints)の書き方。 レスポンシブサイトを作る際には必要不可欠な設定ですが、慣れないとなんともややこしい。 考え方 min-widthと、max-wid…

[wordpress] カテゴリー毎に前後記事へリンクする

wordpressの仕様では、次の記事、前の記事へのリンクはカテゴリーに関係なく、全ての記事の投稿日時順で表示されます。カテゴリー毎の前の記事、次の記事としたい場合のカスタマイズ方法です。ザックリとカスタマイズしてペース…

[CSS] CSSを使って半透明にする方法いろいろ

CSSで、背景や画像、文字を半透明にする方法です。重ねた背景を半透明、バナーボタンを半透明などなど。これを使えば、表現の幅が広がりますね!素材の制作の手間も省けます。 rgbaを使って半透明にする rgbaとは、R,G,…

[Bootstrap 4] cardの写真がIEで伸びてしまう件

Cardを使う機会って多くないですか?便利だなぁって使うのですが、何だかIEで画像が縦に長くなってしまって・・・バグの様です。 ソースコードはこんな感じになると思います。 いろいろ方法があるようですが、以下のCSSを追加…