一个简洁美观的浏览器新标签页扩展，让你快速访问常用网站。

• 🎨 响应式网格布局，自动适配不同屏幕尺寸
• 📝 使用 JSON 文件管理网站数据，配置简单
• 🎯 支持自定义网站图标，自动降级处理
• ✨ 精美的悬停动画效果
• 🔗 新标签页打开链接，不影响当前浏览
• 🖼️ 支持自定义背景图片
• 🚀 支持 Chrome 和 Edge 浏览器

.
├── extension/             # 浏览器扩展
│   ├── manifest.json      # 扩展配置文件
│   ├── index.html         # 主页面
│   ├── app.js             # 核心逻辑
│   ├── style.css          # 样式文件
│   ├── websites.json      # 网站配置
│   ├── bg.jpg             # 背景图片
│   └── icon.svg           # 扩展图标
└── README.md              # 项目文档

1. 打开 Chrome 浏览器
2. 在地址栏输入 chrome://extensions/ 并回车
3. 在右上角打开"开发者模式"开关
4. 点击"加载已解压的扩展程序"按钮
5. 选择项目中的 extension 文件夹
6. 完成！现在打开新标签页就会看到你的导航页

1. 打开 Edge 浏览器
2. 在地址栏输入 edge://extensions/ 并回车
3. 在左下角打开"开发人员模式"开关
4. 点击"加载解压缩的扩展"按钮
5. 选择项目中的 extension 文件夹
6. 完成！现在打开新标签页就会看到你的导航页

编辑 extension/websites.json 文件来添加、删除或修改网站：

{
    "websites": [
        {
            "name": "网站名称",
            "url": "https://example.com",
            "icon": "https://example.com/favicon.ico"
        },
        {
            "name": "GitHub",
            "url": "https://github.com",
            "icon": "https://github.com/favicon.ico"
        }
    ]
}

字段说明：

• name：网站显示名称
• url：网站链接地址
• icon：网站图标 URL（可留空，会显示默认图标）

应用更改：

修改后需要在扩展管理页面点击刷新按钮（或重新加载扩展），然后打开新标签页查看更改。

替换 extension/bg.jpg 文件为你喜欢的背景图片即可。

支持的图片格式：JPG、PNG、WebP 等常见格式

如需修改样式（如卡片大小、颜色、间距等），编辑 extension/style.css 文件。

• 纯原生 HTML + CSS + JavaScript
• Chrome Extension Manifest V3

• 这是一个开发者模式的扩展，不会自动更新
• 图标 URL 如果加载失败，会自动显示默认的问号图标
• 建议使用 HTTPS 的图标链接，避免混合内容警告
• 修改配置或样式后记得在扩展管理页面刷新扩展

MIT License

欢迎提交 Issue 和 Pull Request！

如有问题或建议，欢迎通过 Issue 反馈。