当前位置：首页 > news >正文

【前端】控制台彩蛋彩色键盘

news 2025/7/27 9:25:10

效果如图
控制台

代码如下

      
const colors = {reset: "\x1b[0m",red: "\x1b[31m",green: "\x1b[32m",yellow: "\x1b[33m",blue: "\x1b[34m",magenta: "\x1b[35m",cyan: "\x1b[36m",white: "\x1b[37m",
};console.log(`${colors.red}   ┌─────────────────────────────────────────────────────────────┐${colors.reset}${colors.red}   │${colors.green}┌───┬───┬───┬───┬───┬───┬───┬───┬───┬───┬───┬───┬───┬───┬───┐${colors.red}│${colors.reset}${colors.red}   │${colors.cyan}│Esc│!1 │@2 │#3 │$4 │%5 │^6 │&7 │*8 │(9 │)0 │_- │+= │|\\ │~  │${colors.red}│${colors.reset}${colors.red}   │${colors.green}├───┴─┬─┴─┬─┴─┬─┴─┬─┴─┬─┴─┬─┴─┬─┴─┬─┴─┬─┴─┬─┴─┬─┴─┬─┴───────┐${colors.red}│${colors.reset}${colors.red}   │${colors.cyan}│ Tab │ Q │ W │ E │ R │ T │ Y │ U │ I │ O │ P │{ [ │ }] │ BS│${colors.red}│${colors.reset}${colors.red}   │${colors.green}├─────┴┬──┴┬──┴┬──┴┬──┴┬──┴┬──┴┬──┴┬──┴┬──┴┬──┴┬──┴─────────┤${colors.red}│${colors.reset}${colors.red}   │${colors.cyan}│ Ctrl │ A │ S │ D │ F │ G │ H │ J │ K │ L │: ;│" '│ Enter  │${colors.red}│${colors.reset}${colors.red}   │${colors.green}├──────┴─┬─┴─┬─┴─┬─┴─┬─┴─┬─┴─┬─┴─┬─┴─┬─┴─┬─┴─┬─┴────┬───────┤${colors.red}│${colors.reset}${colors.red}   │${colors.cyan}│ Shift  │ Z │ X │ C │ V │ B │ N │ M │< ,│> .│?/│Shift │Fn  │${colors.red}│${colors.reset}${colors.red}   │${colors.green}└─────┬──┴┬──┴──┬┴───┴───┴───┴───┴───┴──┬┴───┴┬──┴┬─────┴───┘${colors.red}│${colors.reset}${colors.red}   │${colors.cyan}      │Fn │ Alt │         Space         │ Alt │Win│          ${colors.red}│${colors.reset}${colors.red}   │${colors.green}      └───┴─────┴───────────────────────┴─────┴───┘          ${colors.red}│${colors.reset}${colors.red}   └─────────────────────────────────────────────────────────────┘${colors.reset}
`);