首页 > 代码库 > 第一百七十九节,jQuery-UI,知问前端--按钮 UI

第一百七十九节,jQuery-UI,知问前端--按钮 UI

jQuery-UI,知问前端--按钮 UI

 

学习要点:

  1.使用 button 按钮

  2.修改 button 样式

  3.button()方法的属性

  4.button(‘action‘, param)

  5.单选、复选按钮

按钮(button),可以给生硬的原生按钮或者文本提供更多丰富多彩的外观。它不单单 可以设置按钮或文本,还可以设置单选按钮和多选按钮。

 

一.使用 button 按钮

使用 button 按钮 UI 的时候,不一定必须是 input 按钮形式,普通的文本也可以设置成 button 按钮。

$(‘#search_button‘).button();

 

二.修改 button 样式

在弹出的 button 对话框中,在火狐浏览器中打开 Firebug 或者右击->查看元素。这样, 我们可以看看 button 的样式,根据样式进行修改。我们为了和网站主题符合,对 dialog 的 标题背景进行修改。

//无须修改 ui 里的 CSS,直接用 style.css 替代掉
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
background:url(../img/ui_header_bg.png);
}
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active {
background:url(../img/ui_white.png);
}

注意:其他修改方案类似。

 

第一百七十九节,jQuery-UI,知问前端--按钮 UI