WordPress美化:按钮及条幅背景CSS代码分享

微饭网官方微信

通过对应的CSS样式调用,我们可以把自己的文章变得更加丰富多彩。

按钮样式CSS
样式预览:
      
代码调用:

<button type="button" class="btn btn-default">默认</button>
<button type="button" class="btn btn-primary">主要</button>
<button type="button" class="btn btn-success">成功</button>
<button type="button" class="btn btn-info">信息</button>
<button type="button" class="btn btn-warning">警告</button>
<button type="button" class="btn btn-danger">危险</button>
<button type="button" class="btn btn-link">链接</button>

说明:这些btn类都可以放入到a标签中进行使用
默认

背景样式CSS
样式预览:

这是成功背景框
这是信息背景框
这是警告背景框
这是危险背景框

代码调用:

<div class="alert alert-success">这是成功背景框</div>
<div class="alert alert-info">这是信息背景框</div>
<div class="alert alert-warning">这是警告背景框</div>
<div class="alert alert-danger">这是危险背景框</div>

说明:如果想要给背景框添加关闭按钮,则要添加一个class以及一个button标签


警告框!这是一个可以关闭的警告框。
<div class="alert alert-warning alert-dismissable">
<button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
警告框!这是一个可以关闭的警告框。
</div>

frome:xkfree

发表评论
加载中...

相关文章