CSS3 Facebook Buttons 项目教程
1. 项目的目录结构及介绍
css3-facebook-buttons/
├── CHANGELOG.md
├── LICENSE.md
├── README.md
├── fb-buttons.css
├── fb-icons.png
└── test.html
- CHANGELOG.md: 记录项目更新日志的文件。
- LICENSE.md: 项目的许可证文件,本项目使用 MIT 许可证。
- README.md: 项目的主文档,包含项目的基本介绍和使用说明。
- fb-buttons.css: 核心 CSS 文件,用于创建 Facebook 风格的按钮。
- fb-icons.png: 按钮图标文件,用于在按钮上添加图标。
- test.html: 测试文件,用于展示和测试按钮效果。
2. 项目的启动文件介绍
项目的启动文件是 test.html
,这是一个 HTML 文件,用于展示和测试 fb-buttons.css
中定义的按钮样式。你可以通过打开 test.html
文件在浏览器中查看按钮的效果。
3. 项目的配置文件介绍
本项目没有传统的配置文件,所有的样式定义都在 fb-buttons.css
文件中。该文件包含了创建默认按钮、蓝色变体按钮、绿色变体按钮以及带有图标的按钮的 CSS 类。
例如,创建一个默认按钮:
<a class="uibutton" href="#">Button</a>
创建一个蓝色变体按钮:
<a class="uibutton confirm" href="#">Button</a>
创建一个绿色变体按钮:
<a class="uibutton special" href="#">Button</a>
创建一个带有图标的按钮:
<a href="#" class="button icon add">New message</a>
通过这些 CSS 类,你可以轻松地创建和定制 Facebook 风格的按钮。