CSS中常用的reset.css初始化设置集合

用于重置html默认样式

 最常用的:

* {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}
*:before,
*:after {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, button, textarea, p, blockquote, th, td {
    margin: 0;
    padding: 0;
}
body {
    background: #fff;
    color: #555;
    font-size: 14px;
    font-family: "Arial", "Microsoft YaHei", "黑体", "宋体", sans-serif;
}
td, th, caption {
    font-size: 14px;
}
h1, h2, h3, h4, h5, h6 {
    font-weight: normal;
    font-size: 100%;
}
address, caption, cite, code, dfn, em, strong, th, var {
    font-style: normal;
    font-weight: normal;
}
a {
    color: #555;
    text-decoration: none;
}
a:hover {
    text-decoration: underline;
}
img {
    bord
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
首先,你需要在jsp页面内调用接口获取到集合数据。可以使用JavaScript的Ajax技术来实现异步请求接口数据。 接下来,你需要将集合数据填充到可搜索下拉框。可以使用JavaScript库或框架来实现这个功能,比如jQuery、Bootstrap-select等。 以下是一个简单的示例代码: 1. 引入jQuery和Bootstrap-select库 ```html <head> <script src="https://code.jquery.com/jquery-3.5.1.min.js"></script> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.14.0/css/bootstrap-select.min.css"> <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.14.0/js/bootstrap-select.min.js"></script> </head> ``` 2. 在页面加载完成后,调用接口获取集合数据,并将数据填充到下拉框 ```html <body> <select id="my-select" class="selectpicker" data-live-search="true"> <option value="">请选择</option> </select> <script> $(document).ready(function() { // 调用接口获取集合数据 $.ajax({ url: 'your-api-url', type: 'GET', dataType: 'json', success: function(data) { // 将集合数据填充到下拉框 $.each(data, function(index, item) { $('#my-select').append('<option value="' + item.value + '">' + item.label + '</option>'); }); // 初始化下拉框 $('#my-select').selectpicker({ // 可根据需要配置下拉框样式、搜索框等属性 }); } }); }); </script> </body> ``` 在上面的示例,我们使用了Bootstrap-select库来实现可搜索下拉框的功能。其,data-live-search="true"属性表示开启搜索框;selectpicker()方法用于初始化下拉框,你可以根据需要配置下拉框的样式、搜索框等属性。 需要注意的是,你需要根据接口返回的数据格式来修改代码的数据解析方式和填充方式。同时,你需要根据具体业务需要对下拉框的样式和属性进行配置。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值