ホームページ >ウェブフロントエンド >htmlチュートリアル >css_html/css_WEB-ITnose の文字列の最初の文字のスタイルを設定する方法
CSS を使用して文字列の最初の文字のスタイルを設定する方法:
この章では、CSS を使用して文字列の最初の文字のスタイルを設定する方法を紹介します。
この効果を実現するために使用した方法は、最初の文字にspanタグをネストすることでした。
コード例は次のとおりです。
<!DOCTYPE html><html><head><meta charset=" utf-8"><meta name="author" content="http://www.softwhy.com/" /><title>蚂蚁部落</title><style>span{ color:red;}</style></head><body><div><span>蚂</span>蚁部落的url地址是softwhy.com</div></body></html>
上記のコードは要件を満たしていますが、少し面倒です。ここでは、疑似オブジェクト セレクターを使用してこの関数を実装する方法を紹介します。
コード例は次のとおりです:
<!DOCTYPE html><html><head><meta charset=" utf-8"><meta name="author" content="http://www.softwhy.com/" /><title>蚂蚁部落</title><style>div::first-letter{ color:red;}</style></head><body><div>蚂蚁部落的url地址是softwhy.com</div></body></html>
上記のコードは要件も満たしています。詳細については、CSS 擬似オブジェクト セレクター E:first-letter/E::first-letter の章を参照してください。
元のアドレスは次のとおりです: http://www.softwhy.com/forum.php?mod=viewthread&tid=18254
詳細については、以下を参照してください: http://www.softwhy.com/divcss/