第 6 åç®ã¯ãCSSã使ã£ãè¦æ ãã®è¯ã表çµã¿ï¼tableï¼ãã§ãã Web ãµã¤ãã®ã¬ã¤ã¢ã¦ãããã¹ã¦ table ã§ã³ã³ããã¼ã«ããã¦ããæ代ãããã¾ããããä»ãããªãã¨ããããå²ç¬ãè²·ãæ代ã§ãã æ¬æ¥ã®ãè¤æ°ã®ãã¼ã¿ã表示・æ¯è¼ã®éã«ããããããããè¦ãã表çµã¿ãã®ããã®ãã¼ãã«ããCSSã使ã£ã¦è¦æ ããããã¦ã¿ã¾ãããã 1. CSS ã®ã¿ã§è¦æ ããããã¦ã¿ã ç·ã¨å¡ãã ãã§è¡¨ç¾ãããä¸çªã·ã³ãã«ãªãã¼ãã«ãä½ã£ã¦ã¿ã¾ãã [HTML] <table id="table-01"> <tr> <th>æ¬ä½å称</th> <th>ã¹ã¿ã³ãå</th> <th>ã¹ãã¼ã</th> <th>æç¶å</th> <th>ç²¾å¯åä½æ§</th> <th>æé·æ§</th> </tr> <tr> <td>ç©ºæ¡ æ¿å¤ªé</td> <td>ã¹ã¿ã¼ã»ãã©ãã</td> <td>A</td> <td>A<
ãã¼ãã«ã¯çªããæãæ¨ã¦ãã¨tableè¦ç´ ããµã¤ãã®ã¬ã¤ã¢ã¦ããè¦è¦çãªç®çã«ä½¿ãäºã¯ãtableæ¬æ¥ã®ä½¿ç¨ç®çã¨ã¯éãããããããã¹ãã ã¨è¨ãæµãã«ãªã£ã¦ãã¾ããããããtableã使ããªã¨è¨ããã¨ã§ã¯ãªãã表ã®ããã«tableè¦ç´ ã使ããã¨ã¯å ¨ç¶æ§ããªãããã§ããããã§ãå³æ°ãªã表ããã¯å¤å°è¦æ ããè¯ãããããã«CSSã§æ´ãã¦ã¿ã¾ããèæ¯ç»åãç¨æãã¦æå®ãããã¨ã«ããããããã¶ã¤ã³ããã¯ãªè¡¨ã«ä»ä¸ããäºãåºæ¥ã¾ãããç»åã使ç¨ããªãã¦ãããç¨åº¦ã¯è¦æ ãè¯ãã§ããæ¹æ³ã ã¨æãã¾ãã ãµã³ãã«ã¨ãã¦ä»¥ä¸ã®tableã使ç¨ãã¾ããborderãcellpaddingãªã©ã®å±æ§ã¯ä¸åè¨å®ãã¦ãã¾ãããsample01.html <table summary="表ã®ãµã³ãã«"> <tr><th>ãµã³ãã«ï¼</th><td>ããä»å¹´ãçµããã§ããã</td></tr> <tr><th>ãµã³ãã«ï¼
ããã¹ãããã¹ãããã¹ãããã¹ãããã¹ãããã¹ãããã¹ããããã¹ãããã¹ãããã¹ãããã¹ãããã¹ãããã¹ãããã¹ãã
表(ãã¼ãã«)é¢é£ã®è¦ç´ ã«ã¯ãå°ç¨ã®ããããã£ãç¨æããã¦ãã¾ãã ãããã®ããããã£ã¯è¡¨(ãã¼ãã«)é¢é£ã®è¦ç´ 以å¤ã®è¦ç´ ã«ãé©ç¨ãããäºã¯ä»æ§ä¸ã¯å¯è½ã§ããããã®çºã«ã¯displayããããã£ã表(ãã¼ãã«)å½¢å¼ã®å¤ã«ããªããã°ãªãã¾ãããããããªããããããã®å¤ããµãã¼ããã¦ãããã©ã¦ã¶ã¯æªã ã«æ®ã©ç¡ããçµå±äºå®ä¸è¡¨(ãã¼ãã«)é¢é£ã®è¦ç´ 以å¤ã®è¦ç´ ã«ã¯ç¡å¹ã¨ãªãã¾ã(displayããããã£ã®èª¬æã§ã¯ã表é¢é£ã®è¡¨ç¤ºå½¢å¼ã¯å²æãã¾ãã)ã 以ä¸ã®ããããã£ã¯ãåºæ¬çã«ç¹ã«æå®ãããã®ãé¤ãã¦<table>è¦ç´ ã«å½ã¦ããã®ã§ãã ãããã¹ã±ã¼ã 4.xã§ã¯ã以ä¸ã®ããããã£ã¯å ¨ã¦ç¡å¹ã§ãããããã¹ã±ã¼ã 4.xã«ã¤ãã¦ã¯ãåèäºé ã¨ãã¦å¾è¿°ãã¦ããã¾ããã table-layoutããããã£â¦è¡¨(ãã¼ãã«)ã®è¡¨ç¤ºæ¹æ³(表ã®ååã®å¹ ã®åãæ¹)ã®æå®ã table-layoutããããã£ã¯ã表
ãªãªã¼ã¹ãé害æ å ±ãªã©ã®ãµã¼ãã¹ã®ãç¥ãã
ææ°ã®äººæ°ã¨ã³ããªã¼ã®é ä¿¡
j次ã®ããã¯ãã¼ã¯
kåã®ããã¯ãã¼ã¯
lãã¨ã§èªã
eã³ã¡ã³ãä¸è¦§ãéã
oãã¼ã¸ãéã
{{#tags}}- {{label}}
{{/tags}}