¥¹¥Ý¥ó¥µ¡¼¥µ¥¤¥È

0

    °ìÄê´ü´Ö¹¹¿·¤¬¤Ê¤¤¤¿¤á¹­¹ð¤òɽ¼¨¤·¤Æ¤¤¤Þ¤¹

    • 2011.05.22 Sunday
    • -
    • -
    • -
    • -
    • -
    • by ¥¹¥Ý¥ó¥µ¡¼¥É¥ê¥ó¥¯

    ¥Ñ¡¼¥È£´¡¡¥ì¥Ã¥¹¥ó£²¤Î¤Þ¤È¤á

    0

      ¥Ü¥Ã¥¯¥¹¤Ë¤è¤ë¥ì¥¤¥¢¥¦¥È

      ¥¹¥¿¥¤¥ë¥·¡¼¥È¤ò»È¤Ã¤¿Web¥Ú¡¼¥¸¤Î¥ì¥¤¥¢¥¦¥È¤Ï¡¢¥³¥ó¥Æ¥ó¥Ä¤½¤Î¤â¤Î¤ò°ì¤Þ¤È¤Þ¤ê¤Î»Í³Ñ¤¤È¢¡Ê¥Ü¥Ã¥¯¥¹¡Ë¤È¹Í¤¨¡¢¤³¤ì¤é¤òÁȤ߹ç¤ï¤»¤Æºî¤Ã¤Æ¤¤¤¯¡£

      float¥×¥í¥Ñ¥Æ¥£¤ò»È¤Ã¤Æ¡¢¥Ö¥í¥Ã¥¯¥ì¥Ù¥ëÍ×ÁǤòÃÊÁȤߤÇÇÛÃÖ¤¹¤ë¡£

      2ÃÊÁȤߤò¥ì¥¤¥¢¥¦¥È¤·¤Æ¤ß¤ë

      #col 1{
          width: 350px;
          float: left;
      }

      #col 2{
          width: 350px;
          float: right;
      }

      #footer {
          clear: both;

      col1¤Ècol2¤Î¥Ö¥í¥Ã¥¯¤Î¼¡¤Îfooter¤Ëclear¡¡both¤òÆþ¤ì¤ë¡£¤½¤¦¤·¤Ê¤¤¤È¸å¤Ë³¤¯¥Ü¥Ã¥¯¥¹¤Î¥³¥ó¥Æ¥ó¥Ä¤Ïfloat¥Ü¥Ã¥¯¥¹¤ÎÈ¿ÂЦ¤Ë²ó¤ê¹þ¤ó¤Ç¤·¤Þ¤¦¤Î¤Ç¡¢²ó¤ê¹þ¤ß¤ò²ò½ü¤¹¤ë¤è¤¦¤Ë¤¹¤ë¡£

      ¥Ê¥Ó¥²¡¼¥·¥ç¥ó¤Î¥¹¥¿¥¤¥ë¤òÀßÄê

      ¥Ê¥Ó¥²¡¼¥·¥ç¥ó¤òºîÀ®¤¹¤ë¾ì¹ç¡¢¥ê¥¹¥ÈÍ×ÁǤ˥¹¥¿¥¤¥ë¤ò»ØÄꤹ¤ë¡£

      divÍ×ÁǤè¤êulÍ×ÁǤò»È¤Ã¤¿Êý¤¬¥°¥ë¡¼¥×²½¤µ¤ì¡¢HTML¤Î¹½Â¤¤¬¤ï¤«¤ê¤ä¤¹¤¯¤Ê¤ê¡¢¸å¤Î¥á¥ó¥Æ¥Ê¥ó¥¹¤Ë¤âÌòΩ¤Ä¡£¸¡º÷¥¨¥ó¥¸¥ó¤Î¥í¥Ü¥Ã¥È¤Ë¤âÍý²ò¤µ¤ì¤ä¤¹¤¤¤Î¤Ç¡¢¥¢¥¯¥·¥Ó¥ê¥Æ¥£¤Î¸þ¾å¤Ë¤â·Ò¤¬¤ë¡£

      ¡ônav li {
          float: left;
          width: 118px;
          height: 20px;
          border: 1px solid #000;
          margin-right: 5px;
          margin-left: 0px;
          font-size: 13px;
          text-align: center;
          background-color: #F0F0F0;
      }

      #content {
          clear: left;
          margin: 20px;
      }

      #nav a {
          display: block;¡¦¡¦¡¦¡¦¥Ü¡¼¥À¡¼¤Ç°Ï¤Ã¤¿Éôʬ¤Î¤É¤Î¾ì½ê¤Ç¤â¥ê¥ó¥¯¤Îµ¡Ç½¤¬Æ¯¤¯¤è¤¦¤Ë¤Ê¤ë¡¦
          width: 118px;
          height: 20px;
          color: #000;
          text-decoration: none;
      }

      #nav a hover {
          color: #FFF;
          background-color: #936;
      }

      #nav {
          float: left;
          width: 740px;
          background: url(img/bg_nav.gif);
      }


      position¥×¥í¥Ñ¥Æ¥£¤òÍý²ò¤¹¤ë

      position¡¦¡¦¡¦ÇÛÃ֤Υ롼¥ë¤ò»ØÄꤹ¤ë¥­¡¼¥ï¡¼¥É
      top¡¦¡¦¡¦´ðÅÀ¤È¤Ê¤ë¾åü¤«¤é¡¢É½¼¨¤µ¤»¤¿¤¤¥Ü¥Ã¥¯¥¹¾åü¤Þ¤Ç¤Îµ÷Î¥
      left¡¦¡¦¡¦´ðÅÀ¤È¤Ê¤ë¾åü¤«¤é¡¢É½¼¨¤µ¤»¤¿¤¤¥Ü¥Ã¥¯¥¹º¸Ã¼¤Þ¤Ç¤Îµ÷Î¥
      right¡¦¡¦¡¦´ðÅÀ¤È¤Ê¤ë¾åü¤«¤é¡¢É½¼¨¤µ¤»¤¿¤¤¥Ü¥Ã¥¯¥¹±¦Ã¼¤Þ¤Ç¤Îµ÷Î¥
      bottom¡¦¡¦¡¦´ðÅÀ¤È¤Ê¤ë¾åü¤«¤é¡¢É½¼¨¤µ¤»¤¿¤¤¥Ü¥Ã¥¯¥¹²¼Ã¼¤Þ¤Ç¤Îµ÷Î¥

      absolute¡¦¡¦¡¦´ðÅÀ¤Î°ÌÃÖ¡Ê´ðÅÀ¤ò»ØÄꤷ¤Æ¤¤¤Ê¤±¤ì¤Ð¥Ö¥é¥¦¥¶¤Îɽ¼¨Îΰè¤Î¶ù¡Ë¤«¤é¬¤ë
      relative¡¦¡¦¡¦position¤Î¥×¥í¥Ñ¥Æ¥£¤ò»ØÄꤵ¤ì¤Ê¤¤¾ì¹ç¤ËÇÛÃÖ¤µ¤ì¤ë°ÌÃÖ¤«¤é¬¤ë
      fixed¡¦¡¦¡¦absolute¤ÈƱ¤¸¤À¤¬¡¢¥¹¥¯¥í¡¼¥ë¤·¤Æ¤âÇÛÃÖ°ÌÃÖ¤ò¸ÇÄꤹ¤ë
      static¡¦¡¦¡¦position¥×¥í¥Ñ¥Æ¥£¤ò»ØÄꤵ¤ì¤Ê¤¤¾ì¹ç¤ÈƱ¤¸¾ì½ê¤ËÇÛÃÖ¤¹¤ë

      absolute¤ò»È¤Ã¤ÆÇÛÃÖ¤¹¤ë
      #box2{
          position: absolute;    
          top: 50px;
          left: 100px;¡¦¡¦¡¦¥¦¥£¥ó¥É¥¦¾åÊÕ¤«¤é¤Îµ÷Î¥¤ò50£ð£ø¡¢º¸ÊÕ¤«¤é¤Îµ÷Î¥¤ò100£ð£ø

      relative¤ò»È¤Ã¤ÆÇÛÃÖ¤¹¤ë

      #box2{
          position: absolute;    
          top: 50px;
          left: 100px;¡¦¡¦¡¦ËÜÍè¥ì¥¤¥¢¥¦¥È¤µ¤ì¤ë¤Ï¤º¤À¤Ã¤¿¾ì½ê¤ò¥¹¥¿¡¼¥ÈÃÏÅÀ¤È¹Í¤¨¤¿µ÷Î¥¡£
      ¡¡¡¡¡¡¡¡¡¡¡¡¡¡¡¡¡¡¡¡¡¡¡¡¡¡¾åÊÕ¤«¤é¤Îµ÷Î¥¤ò50£ð£ø¡¢º¸ÊÕ¤«¤é¤Îµ÷Î¥¤ò100£ð£ø


      fixed¤ò»È¤Ã¤ÆÇÛÃÖ¤¹¤ë

      #box2{
          position: absolute;    
          top: 50px;
          left: 100px;¡¦¡¦¡¦absolute¤ÈƱ¤¸¤À¤¬¡¢¥¹¥¯¥í¡¼¥ë¤·¤Æ¤âÇÛÃÖ¤ÏÊѤï¤é¤Ê¤¤

      static¤ò»È¤Ã¤ÆÇÛÃÖ¤¹¤ë

      #box2{
          position: absolute;    
          top: 50px;
          left: 100px;¡¦¡¦¡¦Æä˥쥤¥¢¥¦¥È¤òÊýË¡¤ò»ØÄꤷ¤Ê¤¤¥Ç¥Õ¥©¥ë¥È¡Ê½é´üÀßÄê¤ÎÃ͡ˤξõÂÖ¤Çɽ¼¨¤µ¤ì¤ë¡£¥¹¥¿¥¤¥ë¤òÀßÄꤷ¤Æ¤â¡¢¤â¤È¤Î°ÌÃÖ¤ËÇÛÃÖ¤µ¤ì¤ë¡£

      ¥¹¥¯¥í¡¼¥ë¥Ð¡¼¤Ä¤­¤Î¥Ü¥Ã¥¯¥¹¤òºî¤ë

      #content {
          overflow: scroll;
      }¡¦¡¦¡¦¥¹¥¯¥í¡¼¥ë¥Ð¡¼¤Ä¤­¤Î¥Ü¥Ã¥¯¥¹¤òºîÀ®

      ¥¹¥¿¥¤¥ë¥·¡¼¥È¤ò»È¤Ã¤¿¥ì¥¤¥¢¥¦¥È¤Î¼ê½ç

      ­¡¥Ö¥í¥Ã¥¯Ê¬¤±¤¹¤ë

      ¡Ö¥Ü¥Ã¥¯¥¹¡ÊÈ¢¡Ë¡×¤È¤¤¤¦³µÇ°¤¬¤¢¤ë¡£Âç¾®¤µ¤Þ¤¶¤Þ¤Ê¥Ü¥Ã¥¯¥¹¤òÀѤ߽Ťͤƺî¤ë¤Î¤¬¡¢¥¹¥¿¥¤¥ë¥·¡¼¥È¤Ë¤è¤¦¤ë¥ì¥¤¥¢¥¦¥È¤ò¹Í¤¨¤ë»þ¤Î´ðËÜ¡£

      ­¢ID¥»¥ì¥¯¥¿¤ò·èÄꤹ¤ë

      ¼¡¤Ë·èÄꤷ¤¿¥Ö¥í¥Ã¥¯¤ËÂФ·¤Æ¤½¤ì¤¾¤ì¤ÎID¥»¥ì¥¯¥¿¤ò·è¤á¤ë¡£
      ¡Ê¥Ø¥Ã¥À¡¼¡¢¥Õ¥Ã¥¿¡¼¡¢¥³¥ó¥Æ¥ó¥Ä¡¢¥Ê¥Ó¥²¡¼¥·¥ç¥ó¡Ë

      ­£¥ì¥¤¥¢¥¦¥È¤ËɬÍפʥ¹¥¿¥¤¥ë¤òÁª¤Ö

      float¥×¥í¥Ñ¥Æ¥£¤Èposition¥×¥í¥Ñ¥Æ¥£¤ò»È¤¤¥ì¥¤¥¢¥¦¥È¤ò¤¹¤ë¡£
      ¥Þ¡¼¥¸¥ó¡¢¥Ñ¥Ç¥£¥ó¥°¡¢¥Ü¡¼¥À¡¼¤Î¥¹¥¿¥¤¥ë¤Ê¤É¤Î¥ì¥¤¥¢¥¦¥È¤Ë´Ø·¸¤¹¤ëÃͤâ¥Ô¥¯¥»¥ëñ°Ì¤Ç·è¤á¤Æ¤ª¤¯¡£

      ­¤¥Ú¡¼¥¸¤ò¹½Â¤²½¤¹¤ë¥Ö¥í¥Ã¥¯Í×ÁǤò¹Í¤¨¤ë

      ʸ¾Ï¹½Â¤¤òÌÀ¼¨¤¹¤ë¸«½Ð¤·¥¿¥°¡¢¥Ê¥Ó¥²¡¼¥·¥ç¥ó¤òºî¤ë¥ê¥¹¥È¥¿¥°¡¢É½ÁȤߤò¤¹¤ë¤¿¤á¤Î¥Æ¡¼¥Ö¥ë¥¿¥°¤Ê¤É¡¢¥Ú¡¼¥¸¤Î¹üÁȤߤǤ¢¤ë¹½Â¤¤ò¼¨¤¹¥Ö¥í¥Ã¥¯Í×ÁǤò·è¤á¤ë¡£

      ­¥³ÆÍ×ÁǤΥ¹¥¿¥¤¥ë»ØÄê¡¢¥¯¥é¥¹»ØÄê¤ò¹Í¤¨¤ë
      ¥Ö¥í¥Ã¥¯Æâ¤Î¾ðÊó¤ËÂФ·¤Æ¡¢ºÙ¤«¤¤¥¹¥¿¥¤¥ë¤ò·è¤á¤ë¡£HTML¤Î³ÆÍ×ÁǤËÂФ¹¤ë¥¹¥¿¥¤¥ë¤À¤±¤Ç¤Ê¤¯¡¢Æȼ«¤Î¥¯¥é¥¹»ØÄê¤âƱÍÍ¡¢³Æ¥Ö¥í¥Ã¥¯¤Ë¤ª¤±¤ë¡¢¥Õ¥©¥ó¥È¥µ¥¤¥º¡¢¹Ô´Ö¡¢¥¤¥ó¥Ç¥ó¥È¡¢Ê¸»úÉý¤Ê¤É¤Î¥Æ¥­¥¹¥È¤Ë´Ø¤¹¤ë»ØÄê¤ò¹Ô¤¦¡£¤½¤Î¾¡¢²èÁü¡¢¥ê¥¹¥È¡¢¥Æ¡¼¥Ö¥ë¤Ê¤É¡¢¥Ú¡¼¥¸¤Ë´Þ¤Þ¤ì¤ë¤¹¤Ù¤Æ¤ÎÍ×ÁǤËÂФ·¤Æ°ì¤Ä°ì¤Ä¥¹¥¿¥¤¥ë¤òŬÍѤµ¤»¤ë¡£

      ¥¹¥¿¥¤¥ë¥·¡¼¥È¤ò»È¤Ã¤¿¥ì¥¤¥¢¥¦¥È¤ò¹Í¤¨¤ë¤È¤­¤Ë¤Ï¡¢¤Þ¤ºÂ礭¤Ê¥Ü¥Ã¥¯¥¹¤Î¥ì¥¤¥¢¥¦¥È¤«¤é»Ï¤Þ¤ê¡¢¤½¤ì¤é¤Ë´Þ¤Þ¤ì¤ë¾®¤µ¤Ê¥Ü¥Ã¥¯¥¹¤Î¥ì¥¤¥¢¥¦¥È¤ò½çÈ֤˷è¤á¤ë¤è¤¦¤Ë¤¹¤ë¡£
      ¥«¥¹¥±¡¼¥Ç¥£¥ó¥°¡¦¥¹¥¿¥¤¥ë¥·¡¼¥È¡ÊCascading Style Sheets¡Ë¤Î̾Á°¤Î¤È¤ª¤ê¡¢Â礭¤Ê¤â¤Î¤«¤é¾®¤µ¤Ê¤â¤Î¤Ø¤È¡ÖÃʳ¬Åª¤ËÏ¢·ë¡ÊCascade)¤µ¤»¤Æ¤¤¤¯¤Î¤¬´ðËÜ¡£

      ¡¡µ¤¤¬¤Ä¤¤¤¿¤é¡¢·ë¹½¿Ê¤ó¤Ç¤¤¤¿¡Á¡ª´ò¤·¤¤

      ¥¹¥Ý¥ó¥µ¡¼¥µ¥¤¥È

      0
        • 2011.05.22 Sunday
        • -
        • 01:11
        • -
        • -
        • -
        • -
        • by ¥¹¥Ý¥ó¥µ¡¼¥É¥ê¥ó¥¯

        ¥³¥á¥ó¥È
        ¥³¥á¥ó¥È¤¹¤ë








           
        ¤³¤Îµ­»ö¤Î¥È¥é¥Ã¥¯¥Ð¥Ã¥¯URL
        ¥È¥é¥Ã¥¯¥Ð¥Ã¥¯

        PR

        calendar

        S M T W T F S
             12
        3456789
        10111213141516
        17181920212223
        24252627282930
        31      
        << March 2024 >>

        selected entries

        categories

        archives

        recent comment

        links

        profile

        search this site.

        others

        mobile

        qrcode

        powered

        ̵ÎÁ¥Ö¥í¥°ºîÀ®¥µ¡¼¥Ó¥¹ JUGEM