[HTML5] æ–°è¦ç´ ã¾ã¨ã‚ã€2014/2/14版勧告候補】 - QiitaDeleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?
![[HTML5] æ–°è¦ç´ ã¾ã¨ã‚ã€2014/2/14版勧告候補】 - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/d49ad6127eb1662ad6a5defc87bc87fd271411f0/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fqiita-user-contents.imgix.net%252Fhttps%25253A%25252F%25252Fcdn.qiita.com%25252Fassets%25252Fpublic%25252Farticle-ogp-background-afbab5eb44e0b055cce1258705637a91.png%253Fixlib%253Drb-4.0.0%2526w%253D1200%2526blend64%253DaHR0cHM6Ly9xaWl0YS11c2VyLXByb2ZpbGUtaW1hZ2VzLmltZ2l4Lm5ldC9odHRwcyUzQSUyRiUyRnFpaXRhLWltYWdlLXN0b3JlLnMzLmFtYXpvbmF3cy5jb20lMkYwJTJGMzg2MCUyRnByb2ZpbGUtaW1hZ2VzJTJGMTQ3MzY4MzYxMT9peGxpYj1yYi00LjAuMCZhcj0xJTNBMSZmaXQ9Y3JvcCZtYXNrPWVsbGlwc2UmZm09cG5nMzImcz1hMWY4MzA2ODI4NzUzMTE2MTlkYmJmNGM5NDZkNThmZA%2526blend-x%253D120%2526blend-y%253D467%2526blend-w%253D82%2526blend-h%253D82%2526blend-mode%253Dnormal%2526s%253D768fa929eecac5d0598f1049f33368c2%3Fixlib%3Drb-4.0.0%26w%3D1200%26fm%3Djpg%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTk2MCZoPTMyNCZ0eHQ9JTVCSFRNTDUlNUQlMjAlRTYlOTYlQjAlRTglQTYlODElRTclQjQlQTAlRTMlODElQkUlRTMlODElQTglRTMlODIlODElRTMlODAlOTAyMDE0JTJGMiUyRjE0JUU3JTg5JTg4JUU1JThCJUE3JUU1JTkxJThBJUU1JTgwJTk5JUU4JUEzJTlDJUUzJTgwJTkxJnR4dC1hbGlnbj1sZWZ0JTJDdG9wJnR4dC1jb2xvcj0lMjMxRTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9NTYmdHh0LXBhZD0wJnM9ZGY1NTY3NTBmOTczN2FmNDQwM2NiNDBhYjI1ZTFlNjM%26mark-x%3D120%26mark-y%3D112%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTgzOCZoPTU4JnR4dD0lNDBtYWNjb3RzYW4mdHh0LWNvbG9yPSUyMzFFMjEyMSZ0eHQtZm9udD1IaXJhZ2lubyUyMFNhbnMlMjBXNiZ0eHQtc2l6ZT0zNiZ0eHQtcGFkPTAmcz0xYTI4OThlYzIzM2ZlZTA4ZjcxYWY2MDk1ZDMyZTEzYg%26blend-x%3D242%26blend-y%3D480%26blend-w%3D838%26blend-h%3D46%26blend-fit%3Dcrop%26blend-crop%3Dleft%252Cbottom%26blend-mode%3Dnormal%26s%3Df437e089877aec9218c5ef7119de26a4)
★HTML5タグリファレンス
<dl>ã‚¿ã‚°ã¯ã€å®šç¾©ãƒ»èª¬æ˜Žãƒªã‚¹ãƒˆã‚’表ã™éš›ã«ä½¿ç”¨ã—ã¾ã™ã€‚ <dl>～</dl>ã®ä¸ã«ã€ <dt>ã‚¿ã‚°ã§å®šç¾©ãƒ»èª¬æ˜Žã•ã‚Œã‚‹è¨€è‘‰ã‚’〠<dd>ã‚¿ã‚°ã§ãã‚Œã«å¯¾å¿œã™ã‚‹èª¬æ˜Žã‚’é…ç½®ã—ã¦ãƒªã‚¹ãƒˆã‚’作æˆã—ã¾ã™ã€‚ 例ãˆã°ã€ç”¨èªžã®å®šç¾©ãƒªã‚¹ãƒˆã‚’作æˆã—ãŸã‚Šã€ä½•ã‹ã®æ‰‹é †ã‚’箇æ¡æ›¸ãã§èª¬æ˜Žã™ã‚‹å ´åˆãªã©ã«ä½¿ç”¨ã—ã¾ã™ã€‚ â– HTML4.01ã‹ã‚‰HTML5ã¸ã®ãƒãƒ¼ã‚¸ãƒ§ãƒ³ã‚¢ãƒƒãƒ—ã«ã‚ˆã‚‹å¤‰æ›´ç‚¹ <dl>ã‚¿ã‚°ã®dlã®ç”±æ¥ã§ã™ãŒã€HTML4.01ã§ã¯definition list（定義リスト）ã®æ„味ã§ã‚ã‚‹ã“ã¨ãŒç¤ºã•ã‚Œã¦ã„ã¾ã—ãŸã€‚ HTML5ã§ã¯ã¯ã£ãã‚Šã¨ã¯ç¤ºã•ã‚Œã¦ã„ã¾ã›ã‚“ãŒã€description list（説明リスト）ã¨ã„ã†ç¨‹åº¦ã®æ„味ã®ã‚ˆã†ã§ã™ã€‚ ã¾ãŸã€ <dt>ã‚¿ã‚°ã¯definition term（定義ã•ã‚Œã‚‹è¨€è‘‰ï¼‰ã‹ã‚‰description term（説明ã•ã‚Œã‚‹è¨€è‘‰ï¼‰ã¸ã€ <dd>ã‚¿ã‚°ã¯definition description（定義ã®
CSSã§è¨ˆç®—å¼ã‚’å¯èƒ½ã«ã™ã‚‹calc()ファンクション
Updated 2014.03.23 / Published 2013.10.28 CSS3ã«calc()ã¨ã„ã†ãƒ•ã‚¡ãƒ³ã‚¯ã‚·ãƒ§ãƒ³ãŒã‚ã‚‹ã®ã‚’ã”å˜çŸ¥ã§ã™ã‹ï¼ŸCSSã«ãŠã„ã¦è¨ˆç®—å¼ã‚’å¯èƒ½ã«ã—ã¦ãれる便利ãªcalc()ファンクションã®ã‚µãƒãƒ¼ãƒˆçŠ¶æ³ã‚„使ã„æ–¹ã«ã¤ã„ã¦ç´¹ä»‹ã—ã¾ã™ã€‚ 「横幅ã«ãƒ‘ーセンテージ値を用ã„ã¤ã¤ã€ãã®æ¨ªå¹…ã‹ã‚‰æŒ‡å®šãƒ”クセル(px)分ã ã‘引ã‘ãŸã‚‰...ã€ã“ã‚“ãªã“ã¨ã‚’æ€ã‚ã‚ŒãŸã“ã¨ãŒã‚ã‚‹ã¨æ€ã„ã¾ã™ã€‚ãれをCSS拡張メタ言語を使ã†ã‚ã‘ã§ã‚‚ãªãã€CSSå˜ç‹¬ã§å®Ÿç¾ã§ãã¦ã—ã¾ã†ã®ãŒcalc()ファンクションã§ã™ã€‚ å‚考：Mathematical Expressions: 'calc()' calc()ファンクションã®å®Ÿè£…çŠ¶æ³ IEIE9よりサãƒãƒ¼ãƒˆ ChromeChrome19より25ã¾ã§-webkit-ã®ãƒ™ãƒ³ãƒ€ãƒ¼è˜åˆ¥å付ãã§å…ˆæ”»å®Ÿè£… Chrome26よりサãƒãƒ¼ãƒˆ FirefoxFirefox4より15
レスãƒãƒ³ã‚·ãƒ–イメージã®ãƒã‚¤ãƒ†ã‚£ãƒ–サãƒãƒ¼ãƒˆ - HTML5 Rocks
The picture element Stay organized with collections Save and categorize content based on your preferences. The previous module demonstrated how the srcset attribute allows you to provide different-sized versions of the same image. The browser can then decide which is the right version to use. If you want to change the image completely, you'll need the picture element. In the same way that srcset b
ã™ã’ー便利ï¼ãƒ‰ãƒ¡ã‚¤ãƒ³åˆ¥ã«ã‚¹ã‚¿ã‚¤ãƒ«ã‚·ãƒ¼ãƒˆï¼ˆCSS）を当ã¦ã‚‹æ–¹æ³•ã€‚
ドメイン別ã«ã‚¹ã‚¿ã‚¤ãƒ«ã‚·ãƒ¼ãƒˆã‚’当ã¦ã‚‹æ–¹æ³•ã€‚ iframe[src*="youtube.com"]{ width: 500px; height: auto; } iframe[src*="nicovideo.jp"]{ width: 320px; height: auto; } 例ãˆã°ã€YouTubeã®å¤–部プレイヤー（iframe）ã®æ¨ªå¹…ã¯500ã«ã—ãŸã„ã‘ã©ã€ãƒ‹ã‚³ãƒ‹ã‚³å‹•ç”»ã®å¤–部プレイヤーã¯320ã«ã—ãŸã„ã¨ãã¯ã€ä¸Šã®ã‚ˆã†ã«æ›¸ãã¨ä¸Šæ‰‹ã動作ã—ã¾ã™ã€‚ a[href*="wayohoo.com"]{ color: red; } a[href*="goryugo.com"]{ color: blue; } ã¡ãªã¿ã«ã€aタグをドメイン別ã«æŒ‡å®šã™ã‚‹å ´åˆã¯ã“ã®ã‚ˆã†ã«ãªã‚Šã¾ã™ã€‚(wayohoo.comã¯é’色ã€goryugo.comã¯èµ¤è‰²ã¨ã™ã‚‹å ´åˆ) ã‚¿ã‚°å[属性å*="URL"]{ /* CSSã®ä¸èº« */ }
HTML5: img è¦ç´ ã® alt 属性 ã®ä»•æ§˜ – attosoft.info
æ¦‚è¦ alt 属性ã«æŒ‡å®šã™ã‚‹ä»£æ›¿ãƒ†ã‚スト 空文å—列ã®ä»£æ›¿ãƒ†ã‚スト alt 属性ã®çœç•¥ 関連リンク 訂æ£ï¼šHTML4/XHTML ã® alt 属性ã«ã¤ã„ã¦ æ¦‚è¦ HTML5 ã§ã¯ img è¦ç´ ã® alt 属性ã®ä»•æ§˜ãŒå¤§å¹…ã«å¤‰æ›´ã•ã‚Œã€HTML4/XHTML ã¨æ¯”較ã™ã‚‹ã¨å®šç¾©ãŒã‹ãªã‚Šè©³ç´°åŒ–ã•ã‚Œã¦ã„る。 HTML5 ã«ãŠã‘ã‚‹ alt 属性 ã®ä»•æ§˜ã‚’概略ã™ã‚‹ã¨æ¬¡ã®ã‚ˆã†ã«ãªã‚‹ã€‚ alt 属性ã«ã¯ç”»åƒã‚’ç½®æ›å¯èƒ½ãªè©³ç´°ãªä»£æ›¿ãƒ†ã‚ストを指定ã™ã‚‹ HTML4/XHTML ã® alt 属性ã¯çŸã„説明 (alt テã‚スト) ã ã£ãŸãŒ HTML5 ã® alt 属性ã¯é•·ã„説明 (title 属性より㯠longdesc 属性ã«è¿‘ã„ (※)) ç”»åƒã®æƒ…å ±é‡ â‰’ alt 属性ã«æŒ‡å®šã™ã‚‹ä»£æ›¿ãƒ†ã‚ストã®æƒ…å ±é‡ ç‰¹å®šã®æ¡ä»¶ã‚’満ãŸã›ã° alt 属性をçœç•¥ã™ã‚‹ã“ã¨ãŒã§ãã‚‹ ※ HTML5 ã®ä»•æ§˜ã¯ãƒ¯ãƒ¼ã‚ングドラフトã§ã¾ã 勧告ã•ã‚Œã¦
HTML5--押ã•ãˆã¦ãŠãã¹ã10ã®ã‚¿ã‚°
HTML5ã§ã¯ã€ã‚¦ã‚§ãƒ–開発時ã«å¼·åŠ›ãªãƒ‘ワーや効率性ã€æŸ”軟性を発æ®ã™ã‚‹ã‚¿ã‚°ã¨å±žæ€§ãŒæ–°ãŸã«è¿½åŠ ã•ã‚Œã¦ã„る。本記事ã§ã¯ã€ãã†ã„ã£ãŸã‚¿ã‚°ã‚’10個é¸ã‚“ã§ç´¹ä»‹ã™ã‚‹ã€‚ HTML5ã§ã¯ã€ä»–ã®ã‚·ã‚¹ãƒ†ãƒ （特ã«æ¤œç´¢ã‚¨ãƒ³ã‚¸ãƒ³ï¼ï¼‰ãŒãƒ‰ã‚ュメントをより容易ã«è§£æžã§ãるよã†ã«ã—ãŸã‚Šã€ä»Šã¾ã§ã«ãªã„データ表示をå¯èƒ½ã«ã—ãŸã‚Šã€è¤‡é›‘ãªJavaScriptã€ã‚ã‚‹ã„ã¯ã€ŒAdobe Flashã€ã‚„「Microsoft Silverlightã€ã¨ã„ã£ãŸãƒ–ラウザã®ãƒ—ラグインを必è¦ã¨ã—ã¦ã„ãŸæ©Ÿèƒ½ã«å–ã£ã¦ä»£ã‚るよã†ãªæ•°ã€…ã®æ–°ãŸãªè¦ç´ や属性ãŒè¿½åŠ ã•ã‚Œã¦ã„る。以下ã§ã¯ã€HTML5を用ã„ã¦ã‚ãªãŸã®ã‚¦ã‚§ãƒ–サイトを構築ã™ã‚‹éš›ã«å½¹ç«‹ã¤10個ã®æ–°ãŸãªã‚¿ã‚°ã‚’紹介ã™ã‚‹ã€‚ ＃1：<video>ã‚¿ã‚°ã¨<audio>ã‚¿ã‚° Flashã‚„Silverlightã¨ã„ã£ãŸãƒ†ã‚¯ãƒŽãƒã‚¸ã‚’用ã„る最大ã®ç†ç”±ã¯ã€ãƒžãƒ«ãƒãƒ¡ãƒ‡ã‚£ã‚¢ã‚³ãƒ³ãƒ†ãƒ³ãƒ„ã®å†ç”Ÿã«ã‚ã‚‹ã¨è¨€ã£ã¦ã‚‚よã„ã ã‚ã†ã€‚HTML5ã§
1
ランã‚ング
メンテナンス
ãŠçŸ¥ã‚‰ã›
リリースã€éšœå®³æƒ…å ±ãªã©ã®ã‚µãƒ¼ãƒ“スã®ãŠçŸ¥ã‚‰ã›
最新ã®äººæ°—エントリーã®é…ä¿¡
j次ã®ãƒ–ックマーク
kå‰ã®ãƒ–ックマーク
lã‚ã¨ã§èªã‚€
eコメント一覧を開ã
oページを開ã
calc()を使ã†ã¨CSSã§å››å‰‡è¨ˆç®—ãŒã§ãる。ãれもコンパイルã—ãªãã¦ã„ã„ãžï¼ - Qiita
{{#tags}}- {{label}}
{{/tags}}