THE HAM MEDIA BLOG

WebƒTƒCƒg§ì‚ð‚µ‚Ä‚¢‚é•û‚ɂ́A•KŽù•i‚È‚ñ‚¶‚á‚È‚¢‚©‚ÆŽv‚í‚ê‚é‚­‚ç‚¢•Ö—˜‚ÈFirefox‚̃AƒhƒIƒ“wFirebugxBHTML‚âCSS‚̃R[ƒfƒBƒ“ƒO‚ð’S“–‚µ‚Ä‚¢‚él‚Ì‘½‚­‚Í‚¢‚ê‚Ä‚¢‚éƒAƒhƒIƒ“‚Å‚·‚ˁB

Firebug‚ð“ü‚ê‚ÄŽg‚Á‚Ä‚¢‚él‚Í‘½‚¢‚悤‚È‚Ì‚Å‚·‚ªAˆÓŠO‚Æ’m‚ç‚ê‚Ä‚¢‚È‚¢‹@”\‚ª·‚è‘òŽR‚¾‚Á‚½‚Æ‚¢‚¤‚±‚Æ‚ªAæ“ú‚̕׋­‰ïiSaCSSj‚É‚Ä”­ŠoIŽg‚Á‚Ä‚¢‚é‚Æ‚¢‚Á‚Ä‚àAˆê•”‚Ì‹@”\‚ÉŒÀ‚ç‚ê‚Ä‚µ‚Ü‚Á‚Ä‚¢‚é‚悤‚È‚Ì‚Å‚·B

‚à‚¿‚ë‚ñu‚»‚ñ‚È‹@”\’m‚Á‚Ä‚é‚æIv‚Æ‚¢‚¤‚­‚ç‚¢Žg‚Á‚Ä‚¢‚él‚à‘½‚¢‚ÆŽv‚¢‚Ü‚·B‚µ‚©‚µA‚»‚ñ‚È‚ÉŽg‚¢‚±‚È‚¹‚Ä‚¢‚È‚¢‚âAŠˆ—p‚Å‚«‚Ä‚¢‚È‚¢I‚Æ‚¢‚¤l‚à•×‹­‰ï‚ÌŽž‚É‘½‚©‚Á‚½‚悤‚ɁAŽÀÛ‚É‚à‘½‚¢‚Í‚¸I

Firebug‚ÌŽg‚¢•û‚ð‚à‚¤­‚µ’m‚Á‚Ä‚¢‚é‚ƁAWebƒTƒCƒg‚̐§ì‚ÌŽž‚É•Ö—˜‚¾I‚ÆŽv‚¦‚éê–Ê‚ª‘½X‚Å‚Ä‚­‚é‚̂ŁA¥”ۍ¡‰ñ‚²Ð‰î‚·‚é‹@”\‚Í—}‚¦‚Ä‚¨‚«AŠˆ—p‚µ‚Ä‚Ý‚Ä‚­‚¾‚³‚¢B

HTML&CSS‚ÌŠm”F

ƒR[ƒ_[‚ªŠî–{“I‚Ɉê”ÔŽg‚Á‚Ä‚¢‚é‚ÆŽv‚í‚ê‚é‹@”\‚Å‚·B•\Ž¦‚³‚ê‚Ä‚¢‚éƒy[ƒW‚ÌHTML‚ÆCSS‚ð•\Ž¦‚µ‚Ä‚¢‚Ü‚·BHTML‚Ì•\Ž¦‚́AJavaScript‚É‚æ‚é•Ï‰»‚à•\Ž¦‚µ‚Ä‚­‚ê‚Ü‚·‚µA‘®«’l‚âƒeƒLƒXƒg‚à‚»‚̏ê‚ŕҏW‚µ‚Ă݂邱‚Æ‚à‚Å‚«‚Ü‚·B

THE HAM MEDIA‚ÅFirebug‚ðŽg—p‚µ‚½•\Ž¦

Œ©‚½‚¢—v‘f‚ð•\Ž¦•”•ª‚©‚çŽw’è‚·‚邱‚Æ‚à‰Â”\‚Å‚·B

uƒy[ƒW“à‚Ì’²‚ׂ½‚¢—v‘f‚ðƒNƒŠƒbƒN‚µ‚Ä‚­‚¾‚³‚¢v

uƒy[ƒW“à‚Ì’²‚ׂ½‚¢—v‘f‚ðƒNƒŠƒbƒN‚µ‚Ä‚­‚¾‚³‚¢v‚©‚ç—v‘f‚ð‘I‘ð‚·‚é‚±‚Æ‚ª‚Å‚«‚Ü‚·B‘I‘ð‚µ‚½—v‘f‚ÍHTML‚¾‚¯‚Å‚È‚­AFirebug‚̉E‘¤‚É‚Í‚»‚Ì—v‘f‚É“K—p‚³‚ê‚Ä‚¢‚éCSS‚ª•\Ž¦‚³‚ê‚Ä‚¢‚Ü‚·B

‘I‘ð’†—v‘f‚ÌCSS

ƒXƒ^ƒCƒ‹‚̈ê”ԏã‚É•\Ž¦‚³‚ê‚Ä‚¢‚éƒZƒŒƒNƒ^‚ªÅ‚à(“K—p‚³‚ê‚é)—Í‚ª‹­‚­A‰º‚ɍs‚­‚ƁAeƒZƒŒƒNƒ^‚È‚Ç‚©‚çŒp³‚³‚ê‚Ä‚«‚Ä‚¢‚éCSS‚ª‡‚É•\Ž¦‚³‚ê‚Ü‚·Bã‘‚«‚³‚ꂽƒvƒƒpƒeƒBi‚æ‚è‹­‚¢ƒZƒŒƒNƒ^‚ÅŽw’肪“ü‚Á‚Ä‚¢‚éƒvƒƒpƒeƒBj‚͉¡ü‚ª“ü‚Á‚Ä‚¢‚āA“K—p‚³‚ê‚Ä‚¢‚È‚¢‚Ì‚ªŽ‹Šo“I‚É‚í‚©‚è‚Ü‚·B

ƒZƒŒƒNƒ^‚̉E‘¤‚ɂ́A‚»‚ÌCSS‚ª‘‚©‚ê‚Ä‚¢‚éƒtƒ@ƒCƒ‹–¼‚ƁA‰½s–ڂɏ‘‚©‚ê‚Ä‚¢‚é‚©‚ªÂ•¶Žš‚Å•\Ž¦‚³‚ê‚Ä‚¢‚Ü‚·B‚¿‚È‚Ý‚É‚»‚̃tƒ@ƒCƒ‹–¼‚ƍs”Ô•”•ª‚̓Šƒ“ƒN‚É‚È‚Á‚Ä‚¢‚āAƒNƒŠƒbƒN‚·‚é‚ÆFirebug‚ÌCSSƒ^ƒu‚ÉŽ©“®‚ňڂèAŠY“–ƒtƒ@ƒCƒ‹‚ÆŠY“–s‚ª‘I‘ð‚³‚ê‚Ä•\Ž¦‚³‚ê‚Ü‚·B

ƒXƒ^ƒCƒ‹‚Ì—ÝŒv•\Ž¦

’ʏ킾‚ƃXƒ^ƒCƒ‹‚Å•\Ž¦‚³‚ê‚Ä‚¢‚éCSS‚́AƒZƒŒƒNƒ^‚²‚Æ‚Ì“K—p‚³‚ê‚Ä‚¢‚éCSS‚É‚È‚Á‚Ä‚¢‚é‚Ì‚Å‚·‚ªAƒXƒ^ƒCƒ‹ƒ^ƒu‚̉E‚É‚ ‚é—ÝŒvƒ^ƒu‚Å‚Ý‚é‚ƁAÅI“I‚É‚Ç‚Ì’l‚Å•\Ž¦‚³‚ê‚Ä‚¢‚é‚Ì‚©‚́uƒXƒ^ƒCƒ‹‚Ì—ÝŒv’lv‚ðˆê–Ú‚ÅŠm”F‚Å‚«‚Ü‚·B

‚±‚̃^ƒu‚Í’n–¡‚É•Ö—˜‚ŁAŒp³‚³‚ꂽ’l‚ÌŒvŽZŒ‹‰ÊŒã‚Ì’l‚à‚»‚±‚ňꔭ‚ÅŠm”F‚Å‚«‚Ü‚·B—Ⴆ‚Î’l‚ª“iƒp[ƒZƒ“ƒgj‚âem‚ÅŽw’肳‚ꂽƒtƒHƒ“ƒgƒTƒCƒY‚ȂǁAŒp³‚ªs‚í‚ꂽ‚ ‚Ƃ̍ŏI“I‚È’l‚ªApx’PˆÊ‚ÅŠm”F‚·‚邱‚Æ‚ª‚Å‚«‚Ü‚·B’l‚ª‚ǂ̂悤‚É‚È‚Á‚½‚Ì‚©•ª‚©‚è‚É‚­‚­‚È‚Á‚Ä‚¢‚é‚悤‚ȏꍇ‚Å‚àA‚±‚Ì—ÝŒvƒ^ƒu‚Å‚Ý‚é‚ƁA‚·‚®‚É‚í‚©‚é‚悤‚É‚È‚Á‚Ä‚¢‚Ü‚·B

—ÝŒvƒ^ƒu‚É‚Ä•\Ž¦

•×‹­‰ï‚ÌŽžA‚±‚Ì—ÝŒvƒ^ƒu‚ð’m‚ç‚È‚©‚Á‚½l‚ª‚È‚ñ‚Æ‚XŠ„‚à‚¢‚Ü‚µ‚½B‚¢‚ë‚¢‚ë•·‚¢‚Ä‚Ý‚½‚Æ‚±‚ëAŽå‚ÉŽg‚Á‚Ä‚¢‚é‚Ì‚ÍHTML‚ƃXƒ^ƒCƒ‹ƒ^ƒu‚¾‚¯‚­‚ç‚¢‚Æ‚Ì‚±‚ƁB

ŒÂl“I‚É‚Í‚±‚Ì—ÝŒvƒ^ƒu‚Ì—˜—pA‚¨‚·‚·‚ß‚Å‚·B

ƒXƒ^ƒCƒ‹iCSSj‚Ì“K—pE–¢“K—p

HTML‚̃Xƒ^ƒCƒ‹ƒ^ƒu‚ł́A“K—p‚µ‚Ä‚¢‚éƒvƒƒpƒeƒB‚»‚ꂼ‚ê‚ɑ΂µ‚āA“K—pE–¢“K—p‚̕ύX‚ª‚·‚®‚É‚Å‚«‚Ü‚·B

‰½‚à’ljÁEíœ‚µ‚Ä‚¢‚È‚¢ó‘Ô

—Ⴆ‚Ώã‚̉摜‚̏ó‘Ô‚É‚È‚Á‚Ä‚¢‚éƒvƒƒpƒeƒB‚Ì‚¤‚¿Afloat‚Ì“K—p‚ðŠO‚µ‚Ä‚Ý‚Ü‚·B

float‚Ì“K—p‚ðŠO‚µ‚½ó‘Ô

‚·‚é‚ƁA•\Ž¦‚µ‚Ä‚¢‚éƒTƒCƒg‚ŁAƒŠƒAƒ‹ƒ^ƒCƒ€‚É•\Ž¦‚ª‚©‚í‚è‚Ü‚·Bã‚̉摜‚Ì—á‚ÅŒ¾‚¤‚ƁAfloat‚̃Xƒ^ƒCƒ‹‚ªŠO‚ꂽó‘Ô‚É‚È‚è‚Ü‚·B

¡“x‚Ífont-weight‚ðŠO‚µ‚Ä‚Ý‚Ü‚µ‚傤B

•\Ž¦‚³‚ê‚Ä‚¢‚éƒtƒHƒ“ƒg‚Ì‘¾‚³‚ª‚·‚®‚ɕω»‚µ‚Ü‚·B

’l‚̕ύX

“K—p‚³‚ê‚Ä‚¢‚éƒvƒƒpƒeƒB‚Ì’l‚à•ÏX‚·‚邱‚Æ‚ª‰Â”\‚Å‚·B

ƒJƒ‰[‚Ƀ}ƒEƒX‚ðæ‚¹‚½ó‘Ô

F‚Ì’l‚â”wŒi‰æ‘œ‚ÌURL•”•ª‚Ƀ}ƒEƒX‚ðæ‚¹‚é‚ƁA‚»‚Ì’l‚̐F‚â‰æ‘œ‚ªƒ|ƒbƒvƒAƒbƒv‚µ‚Ä‚­‚ê‚āA‚»‚̏ê‚ÅŽ‹Šo“I‚ÉŠm”F‚·‚邱‚Æ‚ª‚Å‚«‚Ü‚·B

‚ł́Aæ’ö‚Q‚ƒvƒƒpƒeƒB‚Ì“K—p‚ðŠO‚µ‚½ó‘Ô‚Ì‚Æ‚±‚ë‚ɁA‚³‚ç‚ɃtƒHƒ“ƒg‚̐F‚ð•ÏX‚µ‚Ä‚Ý‚Ü‚µ‚傤B

ƒtƒHƒ“ƒg‚̐F‚ðÔF‚ɕύX

ƒtƒHƒ“ƒg‚̐F‚ªÔF‚ɕύX‚³‚ê‚Ä‚·‚®‚É•\Ž¦‚à•Ï‚í‚è‚Ü‚·B

æ’öA“K—p‚ðŠO‚µ‚½“ñ‚‚̃vƒƒpƒeƒB‚ðÄ‚Ñ“K—p‚µ‚āA‚‚¢‚łɃtƒHƒ“ƒg‚à‘å‚«‚­‚µ‚Ä‚Ý‚½‚肵‚Ü‚·Bfont-size‚â‚»‚Ì‘¼padding‚âmargin‚Ȃǂ́A•ÏX‚µ‚½‚¢ƒvƒƒpƒeƒB‚Ì’l‚ɃtƒH[ƒJƒX‚³‚¹‚āAãƒL[‚≺ƒL[‚ð‰Ÿ‚·‚ƁA1px‚â1%‚¸‚Â’l‚ð•Ï‰»‚³‚¹‚邱‚Æ‚ª‚Å‚«‚Ü‚·B

ƒvƒƒpƒeƒB‚̒ljÁ

“K—pE–¢“K—p‚â’l‚̕ύX‚¾‚¯‚Å‚È‚­AƒvƒƒpƒeƒB‚ð’ljÁ‚·‚邱‚Æ‚à‰Â”\‚Å‚·B

“§–¾“x‚Ìopacity‚ð’ljÁ

ƒZƒŒƒNƒ^‚́AƒvƒƒpƒeƒB‚ª‘‚©‚ê‚Ä‚¢‚È‚¢‹ó”’‚Ì•”•ªi"{"‚à‚µ‚­‚Í"}"‚Ì•”•ª‰¡‚̋󔒁j‚Ń_ƒuƒ‹ƒNƒŠƒbƒN‚µ‚½‚èA‰EƒNƒŠƒbƒN‚́uV‚µ‚¢ƒvƒƒpƒeƒBv‚ŒljÁ‚·‚邱‚Æ‚ª‚Å‚«‚Ü‚·B

‚±‚±‚܂ł̃Xƒ^ƒCƒ‹‚Ì“K—pE–¢“K—p‚â’l‚̕ύX‚Ȃǂ́A•\Ž¦‚ª•ö‚ê‚Ä‚µ‚Ü‚Á‚½Žž‚âA‚¿‚å‚Á‚ÆŒ©‚½–Ú‚ðC³‚µ‚½‚¢Žž‚ȂǁA×‚©‚ȏC³‚ŏd•ó‚µ‚Ü‚·‚̂ŁAŽÀÛ‚Ì•\Ž¦‚ðŒ©‚È‚ª‚çC³‚µ‚½‚¢‚È‚Ç‚ÌŽž‚ÉŠˆ—p‚µ‚Ä‚Ý‚Ä‚­‚¾‚³‚¢B

ƒŒƒCƒAƒEƒgƒ^ƒu

‚±‚±‚àŽg‚Á‚Ä‚¢‚é‚Æ‚¢‚¤l‚ª­‚È‚©‚Á‚½‰ÓŠB‚½‚µ‚©‚É‚»‚ñ‚È‚ÉŽg‚¤‹@‰ï‚Í‚È‚¢‚©‚à‚µ‚ê‚È‚¢‚Å‚·‚ªA‹@”\‚¾‚¯‚Í’m‚Á‚Ä‚¨‚«‚Ü‚µ‚傤B‚±‚±‚Å‚Í—v‘f‚ðƒ{ƒbƒNƒXƒ‚ƒfƒ‹‚Å•\Ž¦‚³‚¹‚Ä‚Ý‚½Žž‚Ì’l‚ª•\Ž¦‚³‚ê‚Ü‚·Bc‰¡‚̃TƒCƒYApaddingAborderAmargin‚Ì‚»‚ꂼ‚ê‚Ì’l‚ðã‰º¶‰E‚Ì‚»‚ꂼ‚ê‚ÅŠm”F‚Å‚«‚Ü‚·B‚à‚¿‚ë‚ñ‚±‚±‚Å‚à’l‚̕ύX‚ª‰Â”\B

‚»‚ñ‚È‚É•Ö—˜‚Å‚Í‚È‚¢‚Ì‚Å‚·‚ªA‚±‚̃{ƒbƒNƒXƒ‚ƒfƒ‹‚Ƀ}ƒEƒX‚ðæ‚¹‚é‚ƁA‰æ–ʏã‚ɖڐ·‚肪•\Ž¦‚³‚ê‚Ü‚·B‘債‚Ä–ð‚É‚Í‚½‚¿‚Ü‚¹‚ñ‚ªEEE

ƒ}ƒEƒX‚ðæ‚¹‚½ó‘Ô‚É‚µ‚Ä‚­‚ê‚éu:hoverv

‚±‚ê‚́u:hoverv‚Ì‹[Ž—ƒNƒ‰ƒX‚ð‚‚¯‚½—v‘f‚ðAŽÀÛ‚Ƀ}ƒEƒX‚ªæ‚Á‚½ó‘Ô‚É‚µ‚Ä‚­‚ê‚Ü‚·B

:hover‚Ì“K—p

‹[Ž—ƒNƒ‰ƒX‚É’l‚ð“ü‚ê‚Ä‚¢‚鎞‚ȂǁA‚»‚̏ó‘Ô‚ðƒ`ƒFƒbƒN‚·‚éÎ‚ɖ𗧂¿‚Ü‚·B:hover‚Ì‘¼‚É‚Í:activeó‘Ô‚É‚à‚µ‚Ä‚­‚ê‚Ü‚·B

’ˆÓ‚Æ‚µ‚ẮA‚ ‚­‚Ü‚Å:hover‚Ì‹[Ž—ƒNƒ‰ƒX‚ð‚‚¯‚½CSS–ʂł̃`ƒFƒbƒN‚ª‰Â”\‚È‚¾‚¯‚Å‚ ‚Á‚āAJavaScript‚ł̕ω»‚ɂ͑Ήž‚µ‚Ä‚¢‚È‚¢‚Å‚·B

HTMLƒ^ƒu‚Ì•\Ž¦‚ð•ÏX

HTMLƒ^ƒu‚Å•\Ž¦‚³‚ê‚éƒ\[ƒX‚́AŽÀÛ‚̃\[ƒX‚ƈقȂÁ‚Ä‚¢‚āAJavaScript‚ł̕ύX‚à”½‰f‚³‚ê‚Ü‚·B

ƒfƒtƒHƒ‹ƒg‚¾‚Æ‚¢‚­‚‚©•\Ž¦‚³‚ê‚Ä‚¢‚È‚¢‚Ì‚ª‚ ‚é‚Ì‚Å‚·‚ªAŒÂl“I‚ɂ̓Rƒƒ“ƒg‚È‚ñ‚©‚à‚Ç‚±‚É‚Ç‚ñ‚È•—‚É‚Í‚¢‚Á‚Ä‚¢‚é‚Ì‚©Šm”F‚µ‚½‚¢ê‡‚ª‚ ‚è‚Ü‚·‚µAƒ\[ƒX‚̈ʒu‚ÌŠm”F‚É‚à•Ö—˜‚Ȃ̂ŁAƒRƒƒ“ƒg‚ð•\Ž¦‚Ƀ`ƒFƒbƒN‚ð“ü‚ê‚Ä•\Ž¦‚³‚¹‚é‚悤‚É‚µ‚Ä‚¢‚Ü‚·B

‚ ‚Ƃ́AŽžXAJavaScript‚̕ω»‚ª‚æ‚­‚í‚©‚ç‚È‚¢‚Æ‚«‚ɁAŽ©“®‚Å“WŠJ‚µ‚Ä‚­‚ê‚é‚悤‚ɁA‚»‚±‚Ƀ`ƒFƒbƒN‚ð“ü‚ꂽ‚肵‚Ä‚Ý‚é‚Æ‚«‚à‚ ‚è‚Ü‚·B

ŠF‚³‚ñ‚àA‚±‚±‚ÍŽg‚¢‚â‚·‚¢‚悤‚ɁiŠm”F‚µ‚â‚·‚¢‚悤‚ɁjŒÂX‚ŏC³‚µ‚Ä‚Ý‚é‚Ì‚ð‚¨‚·‚·‚ß‚µ‚Ü‚·B

ƒNƒBƒbƒNî•ñƒ{ƒbƒNƒX‚Å‚Ì•\Ž¦

¡‰ñ‚̍Ōã‚É‚±‚ê‚ðƒNƒBƒbƒNî•ñƒ{ƒbƒNƒX‚Ì•\Ž¦‚ɂ‚¢‚Ä‚ð‚²Ð‰îBƒNƒBƒbƒN‚È‚Ì‚©ƒNƒCƒbƒN‚È‚Ì‚©EEE‚È‚ñ‚Ä‚Ì‚Í‚Ü‚Ÿ’u‚¢‚Æ‚¢‚āA‚±‚ê‚Ƀ`ƒFƒbƒN‚ð“ü‚ê‚Ä‚¨‚­‚ƁA—v‘f‚̗ݐσXƒ^ƒCƒ‹‚̈ꕔ‚ª‚·‚®‚ÉŠm”F‚Å‚«‚é‚悤‚É‚È‚é‚Æ‚¢‚¤B

ƒNƒBƒbƒNî•ñƒ{ƒbƒNƒX‚ð•\Ž¦‚³‚¹‚½ó‘Ô

‰½‹C‚ÉŠm”F‚É•Ö—˜‚©‚È‚È‚ñ‚ÄŽv‚Á‚Ä•\Ž¦‚³‚¹‚悤‚Æ‚µ‚½ŽžŠú‚à‚ ‚Á‚½‚Ì‚Å‚·‚ªAŽÀ‚Í‚¯‚Á‚±‚¤ƒEƒUƒCB—v‘f‚ª•Ï‚í‚邽‚тɃ`ƒ‰ƒ`ƒ‰ƒAƒjƒ[ƒVƒ‡ƒ“‚·‚é‚̂ŁA‚¿‚å‚Á‚ƃCƒ‰ƒCƒ‰BŠm”FŽž‚É‚Í•Ö—˜‚È‚ñ‚¾‚¯‚ǂȁ[“™‚ÆŽv‚¢‚È‚ª‚çŽg‚Á‚Ä‚¢‚È‚¢‚¯‚ǁAu‚±‚ñ‚È‹@”\‚à‚ ‚é‚Ì‚©Iv‚Á‚Ă̂𐥔ےm‚Á‚Ä‚¨‚¢‚Ä‚­‚¾‚³‚¢B

‚Ü‚¾‚Ü‚¾•Ö—˜‹@”\–L•x‚ÈFirebug

¡‰ñ‚ÍHTML‚ÆCSS‚ɂ‚¢‚Ä‚ÌFirebug‚ÌŽg‚¢•û‚â‹@”\‚ðÐ‰î‚µ‚Ü‚µ‚½B‚µ‚©‚µA‚Ü‚¾‚Ü‚¾•Ö—˜‹@”\‚Í‘½‚¢‚Å‚·BƒRƒ“ƒ\[ƒ‹‚ȂǂȂǁB‹@”\–L•x‚ÅŽg‚¢‚«‚ê‚Ä‚È‚¢•û‚à‚¢‚é‚ÆŽv‚¢‚Ü‚·‚ªA‚º‚Ђº‚Ђ¢‚ë‚¢‚ëŽg‚Á‚Ä‚Ý‚Ä‚­‚¾‚³‚¢B