³«È¯/html»ÅÍÍ
HTML,JavaScript,CSSÅù¤Î»ÅÍÍ
¤¤¤í¤¤¤íÊʤ¬¤¢¤ë¡¢HTML¤äJavaScript¤Î»ÅÍͤò¤Þ¤È¤á¤Þ¤·¤ç¤¦
PCÈÇOpera¤Î[ɽ¼¨]¢ª[¥¹¥â¡¼¥ë¥¹¥¯¥ê¡¼¥óɽ¼¨]¥â¡¼¥É¤¬¡¢½ÄĹ¥â¡¼¥É¤Ë¤«¤Ê¤ê¶á¤¤¡£
¥Õ¥©¥ó¥È¥µ¥¤¥ºÅù¤Î°ã¤¤¤ò¤Î¤¾¤±¤Ð¥ì¥¤¥¢¥¦¥Èˡ§¤Ï¤Û¤ÜƱ¤¸¤È»×¤ï¤ì¤ë¡£¥Ç¥Ð¥Ã¥°¤Ï¤Þ¤ºPC¤Ç¤ä¤ë¤Î¤¬µÈ¡£
´ØÏ¢¥ê¥ó¥¯
- Opera > ¥¹¥â¡¼¥ë¡¦¥¹¥¯¥ê¡¼¥ó¡¦¥ì¥ó¥À¥ê¥ó¥°¡ÊSSR¡Ëµ»½Ñ¸þ¤±¥ª¡¼¥µ¥ê¥ó¥°
- http://web.archive.org/web/20061208131144/http://jp.opera.com/products/mobile/dev/multiple/
- Ãæ¤Ç¤âCSS¤Îµ½Ò¤Ï¡ÚɬÆÉ¡ª¡Û
- (»ØÄê¤É¤ª¤ê¤ËhandheldÍÑCSS¤òÍѰդ¹¤ë¤È½ÄĹ¥â¡¼¥É¤Ç¤âCSS¤¬¸ú¤¯¤è¤¦¤Ë¤Ê¤ë)
- Ajax¥á¥â
- http://www.saturn.dti.ne.jp/~npaka/ajax/index.html
- DS¥Ö¥é¥¦¥¶¤Ç¤Îưºî³Îǧ¤¬¤µ¤ì¤Æ¤¤¤ëµ»½Ñ¥á¥â¥Ú¡¼¥¸
- http://www.saturn.dti.ne.jp/~npaka/ajax/index.html
- DS¥Ö¥é¥¦¥¶¼Â¸³¥Ú¡¼¥¸
- http://ds.wakufactory.jp/dev/
- ½ÄĹ¥â¡¼¥É¤ò¸ÇÄê²èÌ̤ǻȤ¦¤¿¤á¤ÎCSS&HTML¥Æ¥ó¥×¥ì¤¬¤¢¤ë
- http://ds.wakufactory.jp/dev/
HTML
½ÄĹ¥â¡¼¥É»þ¤ÎÆÃ¼ì¤Êµóư
- Ϣ³¤·¤¿²þ¹Ô¤Ï̵¸ú¤Ë¤Ê¤ë
- ¥Õ¥ì¡¼¥à¤Ï1¤Ä¤Î¥Ú¡¼¥¸¤Ë¹çÀ®¤µ¤ì¤ÆÉ½¼¨¤µ¤ì¤ë
- ¥¹¥Ú¡¼¥µ¡¼²èÁü¤Ê¤É¡¢°ìÉô¤Î²èÁü¤Ïɽ¼¨¤µ¤ì¤Ê¤¯¤Ê¤ë¤³¤È¤¬¤¢¤ë
- (¾ÜºÙÉÔÌÀ¡£¥µ¥¤¥º¤ÇȽÄê?)
- ¤È¤ê¤¢¤¨¤º25¡ß50px¤Îpng¤Ïɽ¼¨¤µ¤ì¤º¡¢30¡ß50px¤Ïɽ¼¨¤µ¤ì¤¿¡£¤³¤Î¤¢¤¿¤ê¤Ë¶Ìܤ¬¤¢¤ë?
- CSS¤Ç¤Îposition:absolute¤äÉý¡¦¹â¤µ¤Ê¤É¤ÎÀäÂлØÄê¤Ã¤Ý¤¤¤â¤Î¤Ï̵»ë¤µ¤ì¤ë·¹¸þ¤Ë¤¢¤ë
- ¥ê¥ó¥¯Æâ¤Î¸å¤Ë¶¯À©Åª¤Ë²þ¹Ô¤¬Æþ¤ë¾ì¹ç¤¬¤¢¤ë(¥ê¥ó¥¯Æâ¤Îʸ»ú¤Ë¤è¤Ã¤ÆÊѤï¤ë?)
- ʸ»ú¤Î¿§»ØÄê¤¬ÇØ·Ê¿§¤ÈÈæ¤Ù¤Æ¤¢¤Þ¤êÊѲ½¤¬Ìµ¤¤¾ì¹ç¡¢Ê¸»ú¤Î¿§¤¬»ØÄê¤È°Û¤Ê¤Ã¤ÆÉ½¼¨¤µ¤ì¤ë¤³¤È¤¬¤¢¤ë
- (ÇØ·Ê¤¬#FFFFFF,ʸ»ú¤¬#EEEEEE¤Ê¤É¤Î¤È¤¡¢Ê¸»ú¤¬¹õ¤Çɽ¼¨¤µ¤ì¤¿/¾ÜºṲ̀³Îǧ)
¤¿¤À¤·¡¢¾åµ¤ÎOpera¥µ¥¤¥È¤Ë¤¢¤ë¤è¤¦¤ËhandheldÍѤÎCSS¤òÍѰդ·¤Æ¤ä¤ë¤È¡¢½ÄĹ¥â¡¼¥É¤Ç¤âCSS¤¬Í¸ú¤Ë¤Ê¤ë
(¥ì¥ó¥À¥ê¥ó¥°µ¬Â§¤¬ÊѤï¤ê¡¢¥Æ¡¼¥Ö¥ëÅù¤âÉáÄ̤˥ì¥ó¥À¥ê¥ó¥°¤µ¤ì¤ë¤è¤¦¤Ë¤Ê¤ë¡£)
¡ÚÎã¡Û <link rel="stylesheet" href="handheld.css" type="text/css" media="handheld">
¤¿¤À¤·¡¢frameÆâ¤Î¥Ú¡¼¥¸¤Ë´Ø¤·¤Æ¤Ïmedia=handheld¤Î¥¹¥¿¥¤¥ë¥·¡¼¥È¤Ç¾å¼ê¤¯¥¹¥¿¥¤¥ë»ØÄ꤬¸ú¤«¤Ê¤¤¤è¤¦¤À(ÊýË¡¤¬¤¢¤ë¤Î¤«¤â?)
½ÄĹ¥â¡¼¥É¸þ¤±CSS´ØÏ¢¤Ë¤Ä¤¤¤Æ¡£
ËÜ¥¹¥ì8-54»á¤Î°úÍÑ 54 ̾Á°¡§¤³¤¯¤Ê¤¤¤Î¤À¤ì¤«[sage] Åê¹ÆÆü¡§2006/09/14(ÌÚ) 23:49:28 ID:EUTUjLlm0 handheldÍѤÎCSS¤¬Å¬ÍѤµ¤ì¤Æ¤¤¤Ê¤¤¤È¡¢ color,background-color,float°Ê³°¤Î¥×¥í¥Ñ¥Æ¥£¤Ï¸ú¤¤Þ¤»¤ó¡£ ¤¿¤À¡¢¥Ö¥í¥Ã¥¯Í×ÁǤËÂФ¹¤ëfloat¤Ï¤Þ¤À³Îǧ¤·¤Æ¤¤¤Þ¤»¤ó¡£ imgÍ×ÁǤËÂФ¹¤ëfloat¤Ï͸ú¤Ç¤¹¡£ handheldÍѤÎCSS¤¬Å¬ÍѤµ¤ì¤Æ¤¤¤ë¤È¡¢¤½¤Î¾¤Î¥×¥í¥Ñ¥Æ¥£¤â¸ú¤¯¤è¤¦¤Ë¤Ê¤ê¤Þ¤¹¡£ ÆÃ¤Ë½ÅÍפÀ¤È»×¤ï¤ì¤ë¡¢display:none;¤â͸ú¡£ ¤ä¤Ð¤¤¤Î¤Ïposition¥×¥í¥Ñ¥Æ¥£¤Ç¤¹¤Í¡£ ²£¥¹¥¯¥í¡¼¥ë½Ð¤ë²ÄǽÀ¤¬Èó¾ï¤Ë¹â¤¤¤Ç¤¹¡£ »È¤ï¤Ê¤¤Êý¤¬ÌµÆñ¤«¤È¡£
2²èÌ̥⡼¥É¤ÇÂ礤ʲèÁü¤òɽ¼¨¤¹¤ëºÝ¤ÎÃí°Õ
640¡ß480°Ê¾å¤Î¥µ¥¤¥º¤Î²èÁü¤Ï¼«Æ°Åª¤Ë½Ì¾®(?)¤µ¤ì¤ë¤¿¤á¡¢¥É¥Ã¥È¤¬¤Ä¤Ö¤ì¤Þ¤¹¡£
Àµ³Î¤Ë¤Ï½Ä¤È²£¤Î¥µ¥¤¥º¤¬768px°ÊÆâ¤«¤Ä½Ä¡ß²£¤Î¥µ¥¤¥º¤¬307200px°ÊÆâ¤Î¤è¤¦¤Ç¤¹¡£
¤½¤ì°Ê²¼¤Ë½Ì¾®¤·¤ÆÉ½¼¨¤¹¤ì¤Ð¡¢¥É¥Ã¥È¤Î¤Ä¤Ö¤ì¤Ïµ¯¤¤Ê¤¤¤è¤¦¤Ç¤¹¡£
¥Õ¥©¥ó¥È
¥Õ¥©¥ó¥È¥µ¥¤¥º¤Ï2²èÌ̥⡼¥É¤Çxx-small(²¤Ê¸¤Î¤ß),x-small,small,medium¤Î4Ãʳ¬
½ÄĹ¥â¡¼¥É¤Ç¤Ï¥Õ¥©¥ó¥È¥µ¥¤¥º»ØÄê¤Ï̵»ë¤µ¤ì¡¢Æ±°ì¤Î¥µ¥¤¥º(smallÁêÅö)¤Ë¤Ê¤ë
¤¿¤À¤·<pre>¥¿¥°¤ÎÃæ¤À¤±¤Ï°ì²ó¤ê¾®¤µ¤¤Ê¸»ú¤Ë¤Ê¤ë
| ¥µ¥¤¥º | % | em | px |
|---|---|---|---|
| Ãæ | 87.5°Ê¾å | 0.85°Ê¾å | 14°Ê¾å |
| ¾® | 68.75°Ê¾å | 0.66°Ê¾å | 11°Ê¾å |
| ¶Ë¾® | 56.25°Ê¾å | 0.54°Ê¾å | 9°Ê¾å |
| Ķ¶Ë¾® | 56.25̤Ëþ | 0.54̤Ëþ | 9̤Ëþ |
small,medium¤Ë´Ø¤·¤Æ¤Ïfont-weight:bold¤¬Í¸ú(²¤Ê¸¤Î¤ß)
color¤Ï2²èÌ̥⡼¥É¡¢½ÄĹ¥â¡¼¥É¶¦¤Ë͸ú
table
½ÄĹ¥â¡¼¥É»þ¤Ï̵»ë¤µ¤ì¤ë¡£
´°Á´¤Ë̵»ë¤µ¤ì¤ë¤ï¤±¤¸¤ã¤Ê¤¯¤Æ¡¢²£Éý¤Ë¤¢¤ï¤»¤ÆµÍ¤á¹ç¤ï¤»¤ë¤è¤¦¤ËŬÅö¤Ë Êø¤µ¤ì¤ë¤È¤¤¤¦¤Î¤¬Àµ¤·¤¤¤ß¤¿¤¤¡£¤Ï¤Ã¤¤ê¤·¤¿Ë¡Â§À¤Ï¤è¤¯¤ï¤«¤é¤ó¡£
¤À¤½¤¦¤Ç¤¹¡£
¾Ü¤·¤¤Ë¡Â§¤¬Ê¬¤«¤Ã¤¿Êý¤Ï¤´°ìÊó¤ò¡Á
¤È¤ê¤¢¤¨¤º³Æ¹Ô¤ÎÀèÆ¬¤Î¥«¥é¥à¤¬¿ô»ú¤À¤È¡¢¹Ô¤ÏÊø¤µ¤ì¤Ê¤¤¤è¤¦¤À¡£<ol>¤ÎÂå¤ï¤ê¤Ë»È¤Ã¤Æ¤ë¤³¤È¤òÁÛÄꤷ¤Æ¤ë¤Î¤«¤Ê¡£
ɽ¼¨Îΰè
- 2²èÌ̥⡼¥É
- ³ÈÂç²èÌÌ:256¡ß176pxʬɽ¼¨¤µ¤ì¤ë
- ½Ì¾®²èÌÌ:³ÈÂç²èÌ̤ò3¡ß3¤Äʬʤ٤¿Ê¬¤¬1²èÌ̤Ëɽ¼¨
- ¥µ¥¤¥º¤Ï¸ÇÄê¤Ç¡¢DSÍѤ˾®¥µ¥¤¥º»ØÄꤷ¤¿HTML¤Ç¤â¡¢Â¤ê¤Ê¤¤Îΰ褬³¥¿§É½¼¨¤µ¤ì¥¹¥¯¥í¡¼¥ë²Äǽ
- ½ÄĹ¥â¡¼¥É
- ¾å²èÌ̲¼²èÌ̤Ȥâ¤Ë¼Âɽ¼¨Îΰè240¡ß176px
- ²¼²èÌÌ¥¹¥¯¥í¡¼¥ë¥Ð¡¼¤¬9px
- ¾å²èÌ̤⥹¥¯¥í¡¼¥ë¥Ð¡¼¤ÈƱ¤¸¤À¤±Çò¿§¤ÎÎΰèͤê
- body¥¿¥°¤Î¶¯À©¥Ñ¥Ç¥£¥ó¥°¤¬º¸±¦¹ç¤ï¤»¤Æ7px(º¸3,±¦4px)
- ¾å²¼¥Ñ¥Ç¥£¥ó¥°¤â3px¤º¤Äͤê
- <body ÇØ·Ê¿§=³¥¿§><div ÇØ·Ê¿§=Çò¿§>ËÜʸ¡Ä¡Ä</div></body>
- ¤ÎÍͤˤ¹¤ë¤È¡¢±ï¼è¤ê¤·¤¿¤è¤¦¤Êɽ¼¨¤Ë¤Ê¤ë
- ¾å²èÌ̲¼²èÌ̤Ȥâ¤Ë¼Âɽ¼¨Îΰè240¡ß176px
CSS
width,height,margin,padding»ÅÍÍ
- width,height»ØÄê¤Î¥µ¥¤¥º¤Ëmargin,padding¤¬´Þ¤Þ¤ì¤ëWinOperaÅù¤ÈƱÍͤΥ֥饦¥º¤Ç¤Ï¤Ê¤¯¡¢width,height»ØÄê¤Î¥µ¥¤¥º¤È¤ÏÊ̤Ëmargin,padding¤ò³ÎÊݤ¹¤ëIEÅù¤ÈƱÍͤÎɽ¼¨
- »²¹Í: ¥Õ¥¡¥¤¥ë¤¬Â¸ºß¤·¤Þ¤»¤ó¡£
½ÄĹ¥â¡¼¥É»þ¤Ë̵»ë¤µ¤ì¤ë¤Ã¤Ý¤¤¥×¥í¥Ñ¥Æ¥£
¤¿¤À¤·¾å¤Ë½ñ¤¤¤Æ¤¢¤ë¤è¤¦¤Ë¡¢media=handheld¤ÎCSS¤òÍѰդ·¤¿¾ì¹ç¤Ï¤³¤Î¸Â¤ê¤Ç¤Ï¤Ê¤¤¡£
- float
- position:absolute;
- display
- display:inline;
- display:compact;
- display:run-in;
- display:none; //¾Ã¤¨¤Æ¤¯¤ì¤Ê¤¤¡¦¡¦¡¦
JavaScript(DOM)
- ½½»ú¥¡¼¤ÈA¥Üͼ¥ó¤Ï¡¢¤½¤ì¤¾¤ì¥Æ¥ó¥¡¼¾å²¼º¸±¦¤ÈEnter¤ËÂбþ¡¢key·Ï¥¤¤Ù¥ó¥È¤Ç¸¡½Ð²Ä
- ¢«=37,¢¬=38,¢ª=39,¢=40,A=13
- ¥¿¥Ã¥Á¤Ïº¸¥¯¥ê¥Ã¥¯ÁêÅö
- JavaScript¤Î¥Ð¡¼¥¸¥ç¥ó¤Ï2.0
Ajax
- XMLHttpRequest¤ÏÍøÍÑÉÔ²Ä
- iframe¤¬»È¤¨¤ë¤Î¤Ç¡¢ÉԲĻë¤Ë¤·¤¿iframe·Ðͳ¤Ç¥Ç¡¼¥¿¤ò¼õ¤±ÅϤ·¤¹¤ì¤Ð¤½¤ì¤Ã¤Ý¤¤¤Î¤Ïºî¤ì¤ë¡£
ºÇ½ª¹¹¿·»þ´Ö¡§2009ǯ05·î31Æü 00»þ41ʬ02ÉÃ