「 css 」 一覧

HTML,CSS

【CSS】jQueryで切り替えるシンプルデザインのタブ装飾で下線を表示しないように工夫してみた

切り替えたときにどうやって「タブの下の線」を消せばよいのか試行錯誤した結果を備忘録としてポストします。

Font Awesomeのアイコン(WEBフォント)をフォームのボタンに使用する方法

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

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

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

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

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

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

以前ラジオボタンの背景色を制御するスクリプトをjQueryで作成したのですが、ラジオボタンを大量に設置するとブラウザが反応しないという事態に陥ったので、CSSの疑似要素を使って制御する方法を紹介します。

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

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

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

HTML,CSS

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

 2015/06/06
-HTML,CSS   , ,

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

HTML,CSS

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

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

HTML,CSS

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

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

HTML,CSS

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

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

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

 2014/08/29
-Bootstrap   , , , ,

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

HTML,CSS

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

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

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

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

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

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

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

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

jQuery

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

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

HTML,CSS

【CSS】文字や画像は透過させず、背景のみ透明度を操作する方法

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

ボックスの透明度を操作する時に「opacity」を使うと、文字や画像までもが透過してしまうので、「background-color:rgba();」を使い、アルファ値を設定することで背景の透明度のみを操作する方法を紹介します。

HTML,CSS

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

HTMLで縦に長いテーブルを組んだ時など、カーソルがどこにあるのかよく分からなくなる事がたまにあるので、マウスカーソルがある行の背景色をCSSの設定のみで変更する方法を紹介します。

Eyecatch html css

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

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

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

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

 2013/05/29
-HTML,CSS   , ,

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

Eyecatch html css

【CSS】CSS3のflexboxで簡単に2カラムのレイアウトを作ってみる

ウェブサイトを作成する際、2カラムや3カラムのレイアウトにしようとすると float や position を使わないと出来ませんでしたが、CSS3では数行のコードで実現可能。忘備録としてポストしておきます。

HTML,CSS

【CSS】blockquoteタグのデザインを見栄えよくしてみる

 2013/03/27
-HTML,CSS   , ,

ポスト内容に参照元のテキストを引用する場合に使う「blockquote」タグですが、デフォルトの見た目がイマイチだったので見やすさ、分かりやすさ、自己満足度を高めるためにデザインを編集してみました。

HTML,CSS

【CSS】tableタグのtd中でURLなどアルファベット文字列を改行させたい場合の書き方

 2013/01/02
-HTML,CSS   , ,

URLなどアルファベットや記号が連続している場合、テーブルの横サイズを500px等に指定していても(自動的に)改行せず、横サイズいっぱいまで続いてしまうような場合に自動改行させるCSSを紹介します。

HTML,CSS

【CSS】改行が入っても文字の頭をそろえる(2行目以降を1文字下げる)方法

箇条書きや注釈に「・」や「※」をよく使うと思いますが、改行すると記号が回りこんで埋もれてしまいがちです。
今回は記号ではありませんが、利用規約をHTML化する作業をしていた時に「(1)」などがやはり回りこんでいたのが非常に気になったので、それを回避、揃える方法を備忘録としてポストします。

Eyecatch wordpress

WPプラグイン「syntaxhighlighter」のフォントサイズ調整

syntaxhighlighterのフォントサイズが気になった(妙に大きかった)ので調整したので、そのログ替わりのポストです。

no image

デフォルトテーマ「Twenty Ten」のヘッダロゴ部分の変更

というわけで、WordPress関連最初の投稿。 インストールしたWPにはデフォ ...