給 console 新增顏色

2021-09-12 06:34:12 字數 1578 閱讀 3741

簡評:使用 %c 宣告可以給 console 的輸出新增 css 樣式,日誌太多的話,給不同種類的日誌設定不同的樣式,可以極大的提公升閱讀體驗。
%c: 標識將 css 樣式應用於 %c 之後的 console 訊息。

可以給同一條 console 訊息設定多種顏色。

console.log(

'nothing here %chi cat %chey bear', // console message

'color: blue', 'color: red' // css style

);

這裡有五種 console 型別的訊息:

你可以自定義自己的日誌樣式,例如:

console.log('%cconsole.log', 'color: green;'); 

console.info('%cconsole.info', 'color: green;');

console.debug('%cconsole.debug', 'color: green;');

console.warn('%cconsole.warn', 'color: green;');

console.error('%cconsole.error', 'color: green;');

如果要輸出的樣式比較多,字串會比較長,這裡有乙個小技巧, 生成乙個 css array ,通過 join(';') 來合併成乙個 css string。

例如:

// 1.將css樣式傳遞給陣列

const styles = [

'color:green',

'background:yellow',

'font-size:30px',

'border:1px solid red',

'text-shadow:2px 2px black',

'padding:10px',

]。join(';'); // 2.連線單個陣列項並將它們連線成乙個用分號分隔的字串(;)

// 3.傳遞樣式變數

console.log('%chello there',styles);

// or

console.log('%c%s', styles, 'some important message here');

在 node.js 環境,你可以使用 color reference 來設定樣式。例如:

// cyan

console.log('\x1b[36m%s\x1b[0m', 'i am cyan');

// yellow

console.log('\x1b[33m%s\x1b[0m', 'yellow' );

原文: 

colorful console message

給menu新增顏色

不多說,上圖,見 view plain package lab.sodino.menutest import android.content.context import android.os.bundle import android.os.handler import android.util....

給UILabel區域性文字新增顏色

如果是整體加顏色的話,可以直接用nsattributedstring attstr nsattributedstring alloc initwithstring str attributes 然後呼叫uilabel的 setattributedtext 方法就可以了。如果是區域性顏色的變化,比如搜...

js 給樣式新增隨機顏色

下面提供了三種獲取隨機顏色值的方法 方法一 建立乙個顏色 hex 值陣列,然後隨機抽取這個陣列裡6個值,組合生成顏色。function color1 簡寫 function color4 方法二 在0 16777215之間的生成乙個隨機數,然後轉換為16進製制,如果沒有6位數就在前面加 0。func...