CSS 今度はメッセージぼたんです・・・
今度は・・・
メッセージぼたんをつけちゃいます
また好みの画像をダウンドードして画像フォルダにアップ
画像のURLをチェックしておきます
もちろん自分で画像を作った方がベストです
フリープラグインに書く場合・・・
<div id="topmsg"><a href="javascript;" onclick="window.open('http://msg.ameba.jp/popupSendMessageInput.do?toAmebaId=あなたのID','_blank','resizable=yes,scrollbars=yes,width=430,height=675');return false;" class="linkMsg" title="メッセージを送る"><img src="画像のURL" border="0" /></a></div>
フリースペースに書く場合・・・・
<div id="topmsg"><a href="http://msg.ameba.jp/popupSendMessageInput.do?toAmebaId=あなたのID" target="_blank" ><img src="画像のURL"></a></div>
フリープラグインとフリースペースに書く場合、違いがあります・・・
ボタンを押したときの新しい画面の開き方にも違いがあります・・・
タイトル下のボタンはフリープラグインの場合
ブログ右の付箋紙のようなボタンはフリースペースです
クリックして新しい画面の開き方の違いを確認ください
フリープラグインかフリースペースのどちらかに書いてください・・・両方には書かないで下さい
CSSに貼り付けてください
div#topmsg{
position:absolute;
top:0px;
right:0px;
z-index:100;
}
top:0px; right:0px; の位置の移動は
ブログパーツじゃないよ CSSだよ ペタぼたん
を参考にしてください
またペタぼたん、メニュー等をまだ設置されていない場合は
↓こちらもCSSに加えてください(すでに書かれてあれば必要ありません)
#frame {
position: relative;
}
アメーバサーチだけじゃなかった・・・・
先日・・・・
アメーバサーチって・・・・
アメーバサーチで検索してブログを見ると
記事下広告の件数が増えるって記事にしましたが・・・・
アメーバサーチだけじゃなかった
yahoo! も MSNも Google も
Google AdSenseの広告だから Google はまだわかるけど yahoo! MSNがなぜ?
goo、BIGLOBEサーチ、niftyの@search など他の検索から入った場合は普通に3件でした・・・・
不可解・・・・?
CSS スクロールバー・・3 ついでに・・・
リク記事です・・・・・
というより・・・・・
質問が多いので
毎回答えるのが面倒になっただけです・・・・
/*メッセージスクロール*/
#message{
height:100px;
overflow:auto;
}
/*コメント欄スクロール*/
#comment_module{
height:150px ;
overflow:auto ;
}
/*最近の記事スクロール*/
#recent_entries ul{
height:100px;
overflow:auto;
}
/*アーカイブスクロール*/
#archives ul{
height:80px;
overflow:auto;
}
/*このブログの読者スクロール*/
#reader ul{
height:100px;
overflow:auto;
}
/*ブログテーマ一覧スクロール*/
#theme_list ul{
height:80px;
overflow:auto;
}
/*ブックマークスクロール*/
#bookmark ul{
height:80px;
overflow:auto;
}
/*お気に入りブログスクロール*/
#favorite ul{
height:100px;
overflow:auto;
}
/*最近のコメントスクロール*/
#recent_comment ul{
height:100px;
overflow:auto;
}
/*ランキングスクロール*/
#ranking .menu_frame{
height:50px;
overflow:auto;
}
/*アメブロCMスクロール*/
#ameblo #sideTextAd{
height:100px;
overflow:auto;
}
スキンによってはこの周りに枠が付いています
枠線の色を変えるには・・・
#ameblo{
border:1px solid #ff00ff;
}
枠線を消すには・・・
#ameblo{
border:none;
}
もし・・・フリースペース全体をスクロールさせるには・・
(フリースペースの1部分だけスクロールさせるにはスクロールバー ・・1
)
#freespace{
height:100px;
overflow:auto;
}
※height:100px; の数字で表示される長さを決定します
内容が長さより短い場合はスクロールバーはあらわれません
※スクロールバーの色等は↓を参考にして下さい(表示されるのはIEのみです)
※padding:10px; とか入れて内部にスキマを作ることも
padding:10px; 上下左右に10pxの余裕
padding 無しの場合
+++++++++++++++++++++++++
記入例
/*ブログテーマ一覧スクロール*/
#theme_list ul{
height:80px ;
overflow:auto ;
padding:10px;/* 内部の余裕 */
background-color:#ffccff; /* 背景色 */
scrollbar-face-color: #ffccff; /* 1 表面の色 */
scrollbar-track-color: #ffffff; /* 2 バーの背景の色 */
scrollbar-arrow-color: #ffffff; /* 3 矢印の色 */
scrollbar-highlight-color: #ffffff;/* 4 ハイライトの色 */
scrollbar-3dlight-color: #ffffff;/* 5 外側のハイライトの色 */
scrollbar-shadow-color: #ffffff;/* 6 影の色 */
scrollbar-darkshadow-color: #ffffff;/* 7 外側の影の色 */
}
+++++++++++++++++++++++++
※ついでに・・・質問が多いセンターリングとか文字の色の変更とか・・・・
それぞれセンターリングさせたいところに
text-align:center;/* 中央寄せ */
を、入れてください ・・・ それだけ ・・・・
文字の色を変えたい場合は
color:#ff0099;/* 文字色 */
って文字色を指定するだけ
後は順番は関係なく組み合わせれば出来上がり・・・・
たとえばメッセージボードの場合・・・・
/*メッセージボード中央*/
#message{
text-align:center;/* 中央寄せ */
}
/*メッセージボード*/
#message{
color:#ff0099;/* 文字色 */
}
/*メッセージボード*/
#message{
color:#ff0000;/* 文字色 */
text-align:center;/* 中央寄せ */
}
/*メッセージスクロール&中央*/
#message{
height:100px;
overflow:auto;/* スクロール */
text-align:center;/* 中央寄せ */
}
他にも・・・・
文字サイズを変えたければ・・・・ font-size:12px;/* 文字色 */
背景に色を付けたければ・・・・・ background-color:#ffcccc;/* 背景色 */
背景を画像にするのなら・・・ background:url(画像のURL);/* 背景画像 */
を、入れたりしてね・・・・・・
記事部分を忘れていました・・・m(_ _)m
日付、タイトル、テーマ、記事をまとめて指定する場合は
.entry {
/*ココにCSSの設定*/
}
たとえばスクロールでしたら
.entry {
height:250px;
overflow:auto;
}
日付だけ
.entry .date {
/*ココにCSSの設定*/
}
タイトルだけ
.entry .title {
/*ココにCSSの設定*/
}
テーマだけ
.entry .theme {
/*ココにCSSの設定*/
}
記事だけ
.entry .contents {
/*ココにCSSの設定*/
}
記事URL コメント トラバ
.entry .foot {
/*ココにCSSの設定*/
}