「 css 」 一覧

WEBアイコンフォントの font-awesome を背景として指定する方法

WEBアイコンフォントで有名な「font-awesome」のアイコンを、h1など ...

【css】リスト(UL/LI) を横並べにする「flexbox」の書き方

リストや定義リストなどを横並べに配置する「flexbox」の書き方メモ。 以前書 ...

CSSで画像を円形に切り抜く方法

CSSで画像を丸く切り抜く方法を備忘録としてポストします。

CSSの擬似要素を使い、選択済みラジオボタンの背景色を変更する方法

かなり以前ですが、jQueryを使ってラジオボタンの背景色を変更するスクリプトを書いたのですが、ラジオボタン箇所が多くなると信じられないぐらいに重くなり、ブラウザが反応しなくなるという事態に陥ったので、CSSを使う方法に変更。

その際に使用した方法を備忘録としてポストします。

【CSS】「white-space:nowrap」で、タグクラウドを改行させずに表示させる

2015/08/24   -HTML,CSS
 , , , , ,

以前から、タグクラウドの表示で一文が改行させるのが非常に気になっていましたが、何の事はない、 対象のaタグに対して white-space:nowrap を指定するだけですっきりさせることが出来ましたので、備忘録としてポストします。

Eyecatch html css

【CSS】一番単純でスッキリしているtable装飾用のCSS

2015/06/06   -HTML,CSS
 , ,

タイトル通り、一番単純でスッキリしているテーブルのスタイル指定。
自分へのコピペ用としてポストします。

Eyecatch html css

【CSS】縦幅サイズがわからない要素の縦中央にテキストを配置する方法

heightがわからないボックスの中にテキストを縦方向中央に配置する方法を備忘録としてポストします。

Eyecatch html css

【CSS】backgroundプロパティのまとめ

CSSの背景関係を指定するプロパティですが、一括指定の方法をよく忘れるので、一度、backgroundプロパティに整理してみます。

Eyacatch Html Css

【CSS】奇数・偶数・指定番目などを指定して装飾する方法。

たまに必要になるので毎回調べるのですが、面倒なので忘備録としてポストします。

Eyecatch html css

【CSS】スクロールしても画像を固定表示させる方法。

画像を固定で配置し、スクロールしてもその場に表示させる方法2種類を備忘録としてポストします。

Bootstrapの表(テーブル)の使い方7選

2014/08/29   -Bootstrap
 , , , ,

Bootstrapでのテーブル作成する際のメモを忘備録としてポストします。

Eyecatch html css

【CSS】CSS3でグラデーションを作るメモ。

CSS3でグラデーションを作る際、コピペですぐ出来るよう、忘備録としてポストします。

Bootstrapで画像をレスポンシブ対応した際にセンタリングさせる方法。

Bootstrap使用時、「img-responsive」プロパティで画像をレスポンシブ対応させた場合に左寄せとなりますが、それを中央寄せ(センタリング)させる方法を忘備録としてポストします。

Bootstrap使用時にplaceholder属性の文字色を変更する方法。

Bootstrap使用時、HTML5の placeholder 属性の文字色を変更したい場合の方法を忘備録としてポストします。

CSSのフレームワーク「Bootstrap」を使ってメールフォムを作成してみる。

2014/08/20   -Bootstrap, HTML,CSS
 , , ,

CSSのフレームワークである「Bootstrap」を使って既存のメールフォームをリニューアルしたので、その使い方などを忘備録としてポストします。

Eyecatch jQuery

ブラウザごとに異なるCSSのclassを付与する仕組みをjQueryで作ってみた。

ブラウザごとに異なるCSSのclassを付与し、見た目を変えてみる仕組みをjQueryを使って作ってみました。

Eyecatch html css

【CSS】CSSで背景のみ透明度を操作(文字や画像は透過させない)する方法。

2013/10/11   -HTML,CSS
 , , ,

背景色を黒とした適当なボックスを作成し、画像、テキストを配置。
そのボックスの透明度を操作する時に opacity を使うと、文字や画像までもが透過してしまいます。
こういう場合の適切な方法。

Eyecatch html css

【CSS】CSSのみでマウスオーバーしたテーブル行の背景色を変更してみる。

縦に十数行以上あるテーブルを組んだ時など、どこにカーソルがあるのかよく分からなくなることってあると思います。
その時に、マウスカーソルがある行の背景色を変更することにより、わかりやすくする小技。
今回はCSSのみで実現してみようと思います。

Eyecatch html css

HTML5+CSS3で構築する際のIE9以下への対策

2013/07/17   -HTML,CSS
 , , , ,

システムを作成する際の確認する人のポリシー(?)でIEのバージョンが8という困ったことになったので、これはいい機会だと捉え、HTML5+CSS3対策の実験台となってもらいましたw

Eyecatch html css

【CSS】CSSの「overflow:scroll」でボックス領域にスクロールバーを表示させる方法。

2013/05/29   -HTML,CSS
 , ,

決まったサイズのDIV領域に「overflow」を設定し、スクロールバーを表示させて狭い範囲でも有効に利用する方法です。