異文化に恋してる

異質な考え方に触れて参考になったときの備忘録
異文化に恋してる TOP  >  1940年01月

スポンサーサイト

--/--/-- --:--

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
このエントリーをはてなブックマークに追加
[ --/--/-- --:-- ] スポンサー広告 | TB(-) | CM(-)


Powered by FC2.com のCSS設定

1940/01/05 00:00

FC2の無料ホームページは、広告がフッターに「Powered by FC2.com」しか出ないから便利。

このCSSを設定する方法をメモっておきます。

idは「#fc2_footer」みたいです。


こういう ↓ 中心と背景が分かれたデザインにしたい場合、





body {
    background: #000;
}

#fc2_footer {
    background: #ff0;
    width: 900px !important;
    margin: 0 auto -20px auto;
}



!importantを指定しないと、背景色が横全体に伸びてしまい、
marginの下部に-20pxといったマイナス値を指定しないと、下に隙間ができてしまうようです。

スポンサーサイト
このエントリーをはてなブックマークに追加
[ 1940/01/05 00:00 ] web・ネット備忘録 | TB(0) | CM(0)


hoverで画像が変わるタグ

1940/01/04 00:00

buy.jpgにカーソルをドラッグすると、buy-hover.jpgになるタグをメモっておきます。


class名は「buy」、通常の画像名は「buy.jpg」、オンマウス時の画像名は「buy-hover.jpg」とします。

CSS
.buy a {
background: url(buy.jpg);
display: block;
width: 200px;
height: 50px;
}
.buy a:hover {
background: url(buy-hover.jpg);
}

HTML
<div class="buy"><a href="リンク先"></a></div>


このエントリーをはてなブックマークに追加
[ 1940/01/04 00:00 ] web・ネット備忘録 | TB(1) | CM(0)


ブラウザ別互換性メモ◆コンテンツとサイドバーの背景色

1940/01/03 00:00



・サイドバーの背景が黄色
・メイン部分の背景が赤
・短い方が長い方の長さに合わせる

↑のようなサイトをつくる場合

HTML
<div id="all">
<div id="sidebar">▲▲▲</div>
<div id="main">***<br/>***</div>
</div>

CSS
#all {
  background: url(yellow-red.jpg) repeat; ←背景色を下まで伸ばす画像
  
  width: 600px;
  }
#sidebar {
  float: left;
  width: 200;
  background: #ff0;
  }
#main {
  float: left;
  width: 200;
  background: #f00;
  }


と書くと、



chromeとFirefoxでは、背景色を補う画像が反映されない・・・



⇒divを1つ補うとうまくいく!

HTML
<div id="all">
<div id="sidebar">▲▲▲</div>
<div id="main">***<br/>***</div>
<div id="hosei"></div> ←#all内の最下部に追加
</div>

CSS
#hosei {     ←CSSに追加
  clear: left;
  }



このエントリーをはてなブックマークに追加
[ 1940/01/03 00:00 ] web・ネット備忘録 | TB(0) | CM(0)


プロフィール

有咲

著:有咲
旅行しながら風景描きまくりたいな。

ブログランキング・にほんブログ村へ
にほんブログ村 美術ブログ スケッチ旅行へ
にほんブログ村 その他日記ブログ 雑感へ

ブロとも申請
☆ブロとも申請大歓迎☆

この人とブロともになる
facebook
ご連絡等を承っております

QLOOKアクセス解析


上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。