レスãƒãƒ³ã‚·ãƒ–ã§PCã®ã¨ãã ã‘改行ã—スマホã®æ™‚ã¯æ”¹è¡Œã—ãªã„方法 | IT女åã®ãŠæ°—ã«å…¥ã‚Šãƒ•ã‚©ãƒ«ãƒ€PCã§ä»»æ„ã®ç®‡æ‰€ã«ã„ã‚ŒãŸæ”¹è¡Œã‚’スマホã§ã¯æ”¹è¡Œã›ãšã«è¡¨ç¤ºã—ãŸã„ï¼ã£ã¦ã„ã†ã€ãƒ¬ã‚¹ãƒãƒ³ã‚·ãƒ–対応ã™ã‚‹ã†ãˆã§ã®ã‚ã‚‹ã‚る。 ã“ã®ã‚ã‚‹ã‚ã‚‹å•é¡Œã‚’解決ã™ã‚‹ã¨ã£ã¦ã‚‚ç°¡å˜ãªæ–¹æ³•ã‚’ã”紹介ã—ã¾ã™ã€‚ ã“ã®ã‚ˆã†ãªè¨˜è¿°ã®å ´åˆ <p>ã“ã‚Œã¯ãƒ¬ã‚¹ãƒãƒ³ã‚·ãƒ–対応時ã®æ”¹è¡Œå•é¡Œã‚’解決ã™ã‚‹æ–¹æ³•ã§ã™ã€‚<br class="br-sp">ã“ã“ã§æ”¹è¡Œã—ã¦ã„ã¾ã™ã€‚</p> PCã§ã¯brã‚¿ã‚°ã§æ”¹è¡Œã•ã‚Œã¦è¡¨ç¤ºã•ã‚Œã¾ã™ã€‚ ã“ã“ã«ã€ä»»æ„ã®ã‚¯ãƒ©ã‚¹ã‚’付与ã—ã¦ãŠãã¾ã™ã€‚（例ã§ã¯ã€Œbr-spã€ã¨ã—ã¾ã—ãŸã€‚） スマホã®ã¨ã（例ã§ã¯ç”»é¢ã‚µã‚¤ã‚ºãŒ640px以下ã®å ´åˆï¼‰ã¯ã“ã®brタグを表示ã—ãªã‘ã‚Œã°ã„ã„ã®ã§ã€ä»¥ä¸‹ã®cssを追記ã—ã¾ã™ã€‚ @media screen and (max-width: 640px) { .br-sp { display:none; } } ã“ã‚Œã§ã€OKï¼
Youtube å‹•ç”»ã®åŸ‹ã‚è¾¼ã¿ã‚’CSSã§ãƒ¬ã‚¹ãƒãƒ³ã‚·ãƒ–対応ã™ã‚‹æ–¹æ³•
Froont – responsive web design tool
ã“ã‚Œã¯ä¾¿åˆ©ï¼ãƒ¬ã‚¹ãƒãƒ³ã‚·ãƒ–ã§å¤‰åŒ–ã™ã‚‹ã‚¨ãƒ¬ãƒ¡ãƒ³ãƒˆã‚’一元管ç†ã§ãるワイヤーフレーム作æˆãƒ„ール -RWD Wireframes
Starbucks Coffee Company
Responsive Web Design JP（日本国内ã®ç§€é€¸ãªãƒ¬ã‚¹ãƒãƒ³ã‚·ãƒ–Webデザインを集ã‚ãŸã‚®ãƒ£ãƒ©ãƒªãƒ¼ã‚µã‚¤ãƒˆï¼‰
https://jp.techcrunch.com/2013/03/02/20130228responsive-design-framework-foundation-4-launches/
ã€ãƒ¬ã‚¹ãƒãƒ³ã‚·ãƒ–対応ï¼ã€‘基本最低é™ã€ã‚«ã‚¹ã‚¿ãƒžã‚¤ã‚ºã™ã‚‹ã ã‘ã®ç„¡æ–™wordpressテンプレート「bee-responsive1.0〠|　ãƒãƒ‹ãƒ‡ã‚¶ãƒŽãƒ¼ãƒˆ
æ–°ç€è¨˜äº‹
{{#tags}}- {{label}}
{{/tags}}