Category Archives: CSS講座

CSS 角丸グラデーションボックス

html

あいうえお
あいうえお
あいうえお
あいうえお
あいうえお

css

.box_01 {
background: url(images/box_01.gif) no-repeat top;
[...]

CSS javascriptを使わずmin-heightをIEで使えるようにするCSS

今はjavascriptでやるのが主流?
とりあえず今回はCSSで対応しました。

div {
min-height: 100px;
height:auto !important;
height [...]

CSS Firefoxのリンクの線を消す方法

CSSにて背景画像(画像置換)をしてリンクを付けている場合、Firefoxで閲覧するとはみ出てアウトラインが表示されてしまいます。
そこでこのアウトラインを表示させない方法のご紹介。

a {
outline: n [...]

CSS 背景画像(画像置換)を使わないロールオーバー

前々から画像置換を使ったボタンってどうなの!?って思っていました。
そこでjavascriptを使わずにロールオーバーする方法のご紹介。
サンプルはこちら

CSS 横並びグローバルメニュー02

久しぶりのグローバルナビです。今回も前回同様のテクニックですが、グローバルメニュー下部にボーダーを追加してみました。今回も画像は使っておりません。
サンプルはこちら

CSS シンプルなボーダーを使った見出し(タイトル) その6

シンプル見出しシリーズ第6弾。今回もボーダーを使ってのデザインです。
サンプルはこちら

CSS シンプルなボーダーを使った見出し(タイトル) その5

シンプル見出しシリーズ第5弾。今回もボーダーを使ってのデザインです。
サンプルはこちら

CSS シンプルなボーダーを使った見出し(タイトル) その4

今回はhタグとstrongタグを使った併せ技!
サンプルはこちら

CSS 背景画像を使った見出し(タイトル)Mozilla Japan風

背景画像を使った見出し(タイトル)です。左上にグラデーションのかかった画像を配置することによって、万が一タイトルが2行のなってしまっても見た目の違和感をなくすことができます。
サンプルはこちら

CSS シンプルなボーダーを使った見出し(タイトル) その3

シンプル見出しシリーズ第3弾。今回もボーダーを使ってのデザインです。よく見かけるあれです。
サンプルはこちら