9号社区HTML在线编辑器
运行代码
全屏预览
字号:
默认
10px
12px
14px
16px
18px
20px
24px
28px
32px
文字颜色:
背景颜色:
对齐:
左对齐
居中
右对齐
样式:
加粗
斜体
下划线
列表:
无序列表
有序列表
HTML
CSS
JS
<!DOCTYPE html> <html> <head> <title>9号社区示例</title> </head> <body> <h1>欢迎使用9号社区在线编辑器</h1> <p>这是一个功能完整的HTML/CSS/JS在线编辑器</p> <button id="demo-btn">点击测试</button> <div id="output"></div> </body> </html>
body { font-family: Arial, sans-serif; padding: 20px; line-height: 1.6; } h1 { color: #2c3e50; margin-bottom: 20px; } #demo-btn { background-color: #3498db; color: white; padding: 10px 15px; border: none; border-radius: 4px; cursor: pointer; } #demo-btn:hover { background-color: #2980b9; } #output { margin-top: 20px; padding: 10px; border: 1px solid #ddd; border-radius: 4px; }
document.getElementById('demo-btn').addEventListener('click', function() { const now = new Date(); document.getElementById('output').innerHTML = '按钮点击时间: ' + now.toLocaleTimeString() + '<br>当前日期: ' + now.toLocaleDateString(); });
© 2023 9号社区 - 保留所有权利 | 版本 1.1.0