文章最后更新时间:
介绍
在JavaScript中 console.log可以在浏览器的开发者工具中输出信息。大多用于调试数据,也可以使用在版权声明上。例如使用格式为
console.log('这里填写内容')
将上面代码放入script标签中即可在浏览器按下f12(右击检查)打开开发者工具。edge这种显示的为控制台。Google显示的为console

效果图

参考代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>JavaScript</title>
</head>
<body>
<script>
console.log('%c© ' + new Date().getFullYear() + ' Your Company Name. All rights reserved.',
'background: linear-gradient(90deg, #ff0000, #ff7700, #ffdd00, #00ff00, #0000ff, #ff00ff); color: transparent; -webkit-background-clip: text; font-size: 16px; font-weight: bold;');
console.log('%c version %c 1.0.0 ',
'background:#35495e ; padding: 1px; border-radius: 3px 0 0 3px; color: #fff',
'background:#41b883 ; padding: 1px; border-radius: 0 3px 3px 0; color: #fff')
</script>
</body>
</html>
自定义修改教程
占位符%s:字符串
占位符%d or %i:整数
占位符%f:浮点数
占位符%o:可展开的DOM
占位符%O:列出DOM的属性
占位符%c:根据提供的css样式格式化字符串
例如我想修改为图片输出 那么就需要用到%c进行填写css代码
console.log("%c","background:url(图片路径) no-repeat;padding:50px 300px;line-height:120px");
注意事项
console不能定义img,因此用背景图片代替
console不支持width和height,利用空格和font-size代替;还可以使用padding和line-height代替宽高
查看更多心仪的内容 按Ctrl+D收藏我们
部分内容来自于网络 如有不妥联系站长删除
墨星博客欢迎前来投稿文章
© 版权声明
版权声明
1
本站名称:墨星博客
2
本站网址:moxingbk.com
3
本网站的文章部分内容可能来源于网络,仅供大家学习与参考,如有侵权,请联系站长进行删除处理。
4
本站一切资源不代表本站立场,并不代表本站赞同其观点和对其真实性负责。
5
本站一律禁止以任何方式发布或转载任何违法的相关信息,访客发现请向站长举报。
6
本站附件资源、教程等内容如因时效原因失效或不可用,请评论区留言或联系站长及时更新。
THE END





![WordPress子比主题美化教程[持续更新]-墨星博客 - 提升技术能力的必备资源教程网](https://moxingbk.com/wp-content/uploads/2025/04/20250412205323260-7b9e46aa80bedcb11e9de7ddf053727f.webp)













请登录后发表评论
注册
社交账号登录