ホームページ > 記事 > ウェブフロントエンド > css_html/css_WEB-ITnose の文字列の最初の文字のスタイルを設定する方法
css_html/css_WEB-ITnose の文字列の最初の文字のスタイルを設定する方法
- WBOYオリジナル
- 2016-06-24 11:27:001760ブラウズ
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/
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。