ホームページ制作のネタ発信

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

投稿日：2008/4/11 金曜日更新日：2010/9/6 月曜日

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

執筆者：takehito

comment

: 幅いっぱいのスマホサイトのメニューで1pxのボーダーを追加する方法

基本的にスマホサイトを作る際はリキッドレイアウトにすることが多いと思う。その際１つ１つの要素に対して％（パーセント）指定をするが、1pxのボーダーを要素の間にいれようと思うと、これがなかなかうまく …

: パーセント(%)指定したボックスにボーダーを指定する方法

最近はスマホサイトの制作も増え、ボックスの幅をパーセント(%)指定することが増えてきました。その際にボックスにボーダーを追加するとボーダー分幅が広くなりカラム落ちすることがあります。そんな時は、ボ …

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

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

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

html <div class="box_01"> <div class="box_02"> <ul> <li> …

: CSS　リストを使わなくても簡単にリスト風になるtext-indent

ちょっとした時などに、わざわざ新しくCSSを定義しなくてもリスト風のスタイルがtext-indentでできます。サンプルはこちら