横ã«æ°´å¹³ç·šã®ã‚るテã‚スト図1：横ã«æ°´å¹³ç·šã®ã‚るテã‚ストã®ä¾‹ ãŠã‚‚ã«è¦‹å‡ºã—ãªã©ã§è¦‹ã‹ã‘ã‚‹ã€ãƒ†ã‚ストã®å·¦å³ (ã¾ãŸã¯ãã®ã©ã¡ã‚‰ã‹) ã«æ°´å¹³ç·šã‚’é…ç½®ã—ãŸã‚¹ã‚¿ã‚¤ãƒ«ã€‚ã“れを CSS ã§å®Ÿç¾ã™ã‚‹æ–¹æ³•ã«ã¤ã„ã¦è€ƒãˆã¦ã¿ã¾ã—ãŸã€‚ Demo: 横ã«æ°´å¹³ç·šã®ã‚るテã‚スト é‡ãã¦éš ã™ãƒ‘ターン ã¾ãšæœ€åˆã¯ã€1 本ã®æ°´å¹³ç·šã‚’å¹…ã„ã£ã±ã„ã«é…ç½®ã—ãŸä¸Šã§ã€ãƒ†ã‚ストã«é‡ãªã‚‹éƒ¨åˆ†ã‚’éš ã™ã€ã¨ã„ã†æ–¹æ³•ã§ã™ã€‚ <h2><span>Hello</span></h2> マークアップã¯ã“ã®ã‚ˆã†ã«äºŒé‡ã®è¦ç´ ãŒå¿…è¦ã§ã™ã€‚外å´ã® h2 è¦ç´ ã®æ“¬ä¼¼è¦ç´ ã§æ°´å¹³ç·šã‚’作りã€å†…å´ã® span è¦ç´ ã«èƒŒæ™¯è‰²ã‚’指定ã—ã¦ãƒ†ã‚ã‚¹ãƒˆéƒ¨åˆ†ã‚’éš ã—ã¾ã™ã€‚ h2 { position: relative; text-align: center; } h2:before { border-top: 1px solid; content: ""; position: absolute; top: 5
{{#tags}}- {{label}}
{{/tags}}