按钮分为active和disabled两种状态、
激活状态:按钮呈现出被按压的外观,即背景颜色变深、深色边框和阴影。
禁用状态:按钮颜色会变淡 50%,并失去渐变
看具体的例子:
<body> <!-- 标准的按钮 --> <button type="button">默认按钮</button> <button type="button">激活的默认按钮</button> <br/><br/> <!-- 提供额外的视觉效果,标识一组按钮中的原始动作 --> <button type="button">原始按钮</button> <button type="button">激活的原始按钮</button> <br/><br/> <!-- 表示一个成功的或积极的动作 --> <button type="button">成功按钮</button> <button type="button">激活的成功按钮</button> <br/><br/> <!-- 用于要弹出信息的按钮 --> <button type="button">信息按钮</button> <button type="button">激活的信息按钮</button> <br/><br/> <button type="button">默认按钮</button> <button type="button">禁用的默认按钮</button> <br/><br/> <!-- 提供额外的视觉效果,标识一组按钮中的原始动作 --> <button type="button">原始按钮</button> <button type="button">禁用的原始按钮</button> <br/><br/> <!-- 表示一个成功的或积极的动作 --> <button type="button">成功按钮</button> <button type="button">禁用的成功按钮</button> <br/><br/> <!-- 用于要弹出信息的按钮 --> <button type="button">信息按钮</button> <button type="button">禁用的信息按钮</button> </body>
按钮标签
a,input都可以表现的像一个按钮,但是避免跨浏览器不一致,最好使用Button标签。
<body> <a href="#" role="button">超链接按钮</a> <button type="submit">button按钮</button> <input type="button" value="input按钮"> <input type="submit" value="submit按钮"> </body>