--年--月--日

■スポンサーサイト

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

■テンプレ変更

ブログカスタマイズ覚え書きとして、自分用のメモ記事なので内容はスルーして下さい^^;
※カスタム中はブログ表示が見苦しい状態になってる場合がありますが苦情は受け付けてません(/∇\*)


FC2ブログ登録後のカスタマイズ、まずはテンプレートから変更。
今回もMTでお世話になってる小粋空間様からお借りします。
久々のカスタマイズ、初歩的ミスで表示が乱れ、yujiroさんにはお騒がせしてスミマセンm(_ _)m
いつも親切な対応ありがとうございます^^

元テンプレート
08_07_29_blog.png


※リンクスタイルに position: relative; left: 1px; top: 1px; が使用されている場合
firefoxだと、メロウィンドウにカーソルを合わせた時、再読込みされてしまう動作について
さるさるさんからお知らせがありました。 回避策についてはこちら→ 再読込みの対処法

メロスクリプトをDIVタグで括り <div class="merow"></div>
外部CSSに以下の記述を追加しました。
.merow a:hover {
position: static;
}

firefoxで確認したところ、うまく回避できたようです。 さるさるさんありがとうございました^^

■テンプレート変更 FC2ブログテンプレート
HTML(横型カレンダー版)+スタイルシート - 公式テンプレ複製内容にコピペで利用

・3カラムリキッドレイアウト(中央カラム幅可変) 赤文字の部分を青文字の内容に書換え
<body class="layout-three-column"> → <body class="layout-three-column-liquid">



■表示のズレ修正_________________________________________________________
/* 3カラム(リキッドレイアウト) */
.layout-three-column-liquid #content {
margin: 0 196px 10px; /* margin: 0 185px 10px; */
border-bottom: 1px solid #666699;
border-left: 1px solid #666699;
border-right: 1px solid #666699;
}
.layout-three-column-liquid #links-left{
position: absolute;
width: 170px; /* width: 155px; */
top: 104px; /* top: 95px; */
left: 15px;
color: #ffffff;
}
.layout-three-column-liquid #links-right{
position: absolute;
width: 170px; /* width: 155px; */
top: 104px; /* top: 95px; */
right: 15px;
color: #ffffff;
}



■firefoxで確認時、CSSがリンク部分に反映されてなかったので修正______________________
/* リンク */
a {
text-decoration: none;
/*\*/
overflow: hidden;
/**/
}

a:link {color: #F4AD65; }
a:visited {color: #c28963; }
a:focus,
a:hover,
a:active {
color: #B7C6EE;
position: relative; left: 1px; top: 1px;
}



■フォーム部分変更 MTテンプレートから引用_______________________________________
/* フォーム */
input {
font-family: "Osaka", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku GothicPro", "MS Pゴシック",sans-serif;
margin: 2px;
color: #604033;
font-size: 10px;
background-color: #FAFAD2;
border : 3px dotted #ffcc99;
}

textarea {
font-family: "Osaka", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku GothicPro", "MS Pゴシック",sans-serif;
margin: 2px;
color: #604033;
font-size: 10px;
background-color: #FAFAD2;
border : 3px dotted #ffcc99;
scrollbar-face-color: #FAFAD2;
scrollbar-arrow-color: #ffcc99;
scrollbar-track-color: #FAFAD2;
scrollbar-3dlight-color: #FAFAD2;
scrollbar-highlight-color: #FAFAD2;
scrollbar-shadow-color: #FAFAD2;
scrollbar-darkshadow-color: #FAFAD2;
}



■横カレンダー下部ライン削除__________________________________________________
#globalnavi {
font-size: 10px;
text-align: center;
padding: 5px 0;
border-bottom : 0px solid #ffffff; /* border-bottom : 1px solid #666699; */
color: #604033;
}



スクリプトタグはテーブルかテキストフォーム使った方が見やすいかなぁ ・・

メイン

コメント

コメントする

サイト管理者にのみ通知する

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