如何为Kendo UI警报添加样式

时间:2018-01-20 18:52:47

标签: css kendo-ui

如何在Kendo UI Alert中添加样式,例如标题和按钮的背景?我可以通过向div添加背景颜色样式来设置内容的背景颜色。只是不知道如何使用标题和按钮

来做到这一点



$(document).ready(function() {
  $('#btn').on('click', function() {
    myalert("I'm an Alert");
  })
});

function myalert(content) {
  $("<div></div>").kendoAlert({
    title: "My Title",
    content: content
  }).data("kendoAlert").open();
}
&#13;
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2018.1.117/styles/kendo.common.min.css">
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2018.1.117/styles/kendo.rtl.min.css">
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2018.1.117/styles/kendo.default.min.css">
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2018.1.117/styles/kendo.mobile.all.min.css">

<script src="https://kendo.cdn.telerik.com/2018.1.117/js/jszip.min.js"></script>
<script src="https://kendo.cdn.telerik.com/2018.1.117/js/kendo.all.min.js"></script>

<div class="container">
  <div class="form-horizontal">
    <div class="row">
      <div class="col-md-12">
        <button id="btn" class="btn btn-primary">Click Me</button>
      </div>
    </div>
  </div>
</div>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:0)

如果您在浏览器开发人员工具中检查警报对话框,则可以查看使用的类,然后覆盖css。

e.g。

[HttpPost]
public async Task<IActionResult> RegisterLotsOfPeople(RegisterLotsModel model)
{
    var successful = new List<string>();
    var failed = new List<string>();
    foreach (var toRegister in model.ApplicationUsers)
    {
        var user = new ApplicationUser {UserName = toRegister.UserName, Email = toRegister.Password};
        var result = await _userManager.CreateAsync(user, toRegister.Password);
        if (result.Succeeded)
        {
            successful.Add(toRegister.UserName);
        }
        else
        {
            failed.Add(toRegister.UserName);
        }
    }

    return Json(new {SuccessfullyRegistered = successful, FailedToRegister = failed});
}

<强> DEMO