人気ブログランキング | 話題のタグを見る

練習

画像は小さくビューは大きくの2回目です。
前回よりもスマートな方法が分かりました。
その方法は?
1.画像を普通にアップします。
2.<プレビュー>し、画像を右クリックで<プロパティ>を表示します。
3.画像のURLが表示されますから、これをコピーします。
  ここがポイントでした。

●AタグとIMGタグの構文
  
●新しいウィンドウで開く
  target=_blank
●表示画像の大きさの指定
  width=ピクセル、hight=ピクセル

したがって次のように記述すればいいことになります。


ポイントは画像の保存場所をいかにして知るか、だったですね♪

注意1)[#と#]で囲われるタグは編集が終わったら必要ありませんから削除します。
注意2)画像は500KBまでアップできます。

# by pckmieko | 2013-08-12 19:06 | その他

マウスを置くと画像が変わる

.af { display: none; }
a.lnk { text-decoration: none; color: black; }
a.lnk:hover { background-color: transparent; }
a.lnk:hover .bf { display: none; }
a.lnk:hover .af { display: inline; color:#0000;}

# by pckmieko | 2013-07-16 15:20 | その他

画像

画像_b0197630_951212.gif
画像URL" alt="説明" width="幅" height="高さ" border="0">



CSSの編集で以下のCSSを追加しておきます。

a.myImgBtn{
display:block;
text-indent:-9999px;
background-repeat:no-repeat;
}



画像


# by pckmieko | 2013-07-05 09:53 | その他

画像

.l-button1 img{
visibility:hidden; /* 表示・非表示を指定(表示しない) */
}
.l-button1 a{
display:block; /* ブロックレベルで表示 */
width:100px; /* 横 */
height:50px; /* 縦 */
background-image:url(画像のURL①);
background-repeat : no-repeat;
text-align:center;
line-height:200%;
color:red;
text-decoration:none;
}
.l-button1 a:hover {
background-image:url(画像のURL②);
background-repeat : no-repeat;
text-align:center;
color:white;
text-decoration:none;
}





◆ 例 ②



# by pckmieko | 2013-05-14 19:52 | その他

御雛様




 

御雛様も近いのでワードで描きました。

# by pckmieko | 2013-02-17 17:24 | その他