web-dev-qa-db-ja.com

JavaScript-コンソールログのテキストにスタイルを追加する

最近、ChromeブラウザでFBアカウントにログインしました。開発者ツールを開いたときに、次のようなものが表示されました。

enter image description here

これで、javascript console.log関数を使用してコンソールに何でも追加できることがわかりました。しかし、私の質問は、どのようにテキストにスタイルを追加したのですか?例えば。 "やめる!"黒い境界線と大きなサイズの赤いタホマフォントで書かれています。彼らはどうやってそれをしましたか?

42
Ruchir Gupta

Addy Osmaniには良い説明があります:

https://plus.google.com/+AddyOsmani/posts/TanDFKEN9Kn

基本的に、%cパラメータを使用してCSSスタイルを渡すことができます。例として、chromeコンソールで以下を試してください:

console.log("%cBlue! %cGreen", "color: blue; font-size:15px;", "color: green; font-size:12px;");
61
khalid13