CSS3 Facebook风格按钮使用技术文档

1. 安装指南

在您的项目中使用CSS3 Facebook风格按钮非常简单，您只需按照以下步骤操作：

• 确保您的项目中已经包含CSS文件。
• 将CSS文件中的样式拷贝到您的样式表中。
• 根据需要给HTML元素添加相应的类。

2. 项目使用说明

本项目提供了一种简单的方式来创建类似Facebook风格的按钮和按钮组。以下是具体使用方法：

默认按钮

要创建默认按钮，给任何适当的元素添加uibutton类。

<a class="uibutton" href="#">按钮</a>
<button class="uibutton" type="submit">按钮</button>
<input class="uibutton" type="submit" value="按钮">

蓝色和绿色变种

• 蓝色变种：在uibutton类的基础上添加confirm类。
• 绿色变种：在uibutton类的基础上添加special类。

大按钮

要创建大按钮，在uibutton类的基础上添加large类。

<a class="uibutton large" href="#button">搜索</a>

按钮组

要创建按钮组，将按钮包裹在一个元素中或使用列表，并给该元素或列表添加uibutton-group类。

<div class="uibutton-group">
    <a href="#button" class="uibutton">仪表盘</a>
    <a href="#button" class="uibutton">收件箱</a>
    <a href="#button" class="uibutton">账户</a>
    <a href="#button" class="uibutton">登出</a>
</div>

混合组

要显示带有按钮和按钮组的工具栏，使用一个包装元素，并给该包装元素添加uibutton-toolbar类。

<div class="uibutton-toolbar">
    <a href="#button" class="uibutton">标记为未读</a>

    <div class="uibutton-group">
        <a href="#button" class="uibutton">举报垃圾邮件</a>
        <a href="#button" class="uibutton">删除</a>
    </div>

    <a href="#button" class="uibutton">取消订阅</a>
</div>

带图标的按钮

可以为链接和按钮添加一系列图标，方法是在类中添加icon和任何一个提供的图标类。

<a href="#" class="button icon add">新消息</a>

3. 项目API使用文档

本项目主要是通过CSS类来实现按钮的各种样式，并没有提供API接口。

4. 项目安装方式

由于本项目主要是CSS样式，因此安装方式非常简单：

• 手动将上述使用说明中的CSS类和HTML代码复制到您的项目中。
• 确保您的HTML元素正确地应用了这些CSS类。

这样，您就可以在项目中使用CSS3 Facebook风格按钮了。请注意，本项目已标记为不再维护，可能存在一些兼容性问题。在使用前请确保它符合您的项目需求。