Сценарий:
- Я не могу правильно настроить стиль asp: DropDownList .
- Работает отлично, но не соответствует остальной части формы.
В частности, остальная часть формы имеет меньший размер, без фона и рамки.
Todo:
- Нам нужны выпадающие списки с рамкой и белым фоном (как на странице формы начальной загрузки) (извините, я пока не могу опубликовать изображения).
Судебный случай:
Для отладки я создал голую страницу только с выпадающим списком и текстовым полем для сравнения. Вот этот код:
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<link rel="stylesheet" href="css/bootstrap.css">
<link href="css/bootstrap-select.css" rel="stylesheet" />
<link rel="stylesheet" href="css/style.css">
<link type="text/css" href="css/jquery-ui.min.css" rel="stylesheet" />
<link type="text/css" href="css/jquery-ui.structure.min.css" rel="stylesheet" />
<link type="text/css" href="css/jquery-ui.theme.min.css" rel="stylesheet" />
</head>
<body>
<form id="form1" runat="server">
<div class="col-5">
<asp:TextBox runat="server" id="notmuch0" CssClass="form-control"></asp:TextBox>
<asp:DropDownList ID="DropDownList1" CssClass="form-control-sm" runat="server"><asp:ListItem>1</asp:ListItem></asp:DropDownList>
</div>
</form>
<!-- Javascript-->
<script src="js/jquery.min.js"></script>
<script src="js/jquery-ui.min.js"></script>
<script src="js/bootstrap.js"></script>
<script src="js/bootstrap-select.js"></script>
<script src="js/core.min.js"></script>
<script src="js/script.js"></script>
<script src="js/popper.min.js"></script>
</body>
</html>
Когда мы запускаем код, он создает следующий беспорядок для выпадающего:
<div class="col-5">
<input name="notmuch0" type="text" id="notmuch0" class="form-control">
<select name="DropDownList1" id="DropDownList1" class="form-control-sm select2-hidden-accessible" tabindex="-1" aria-hidden="true">
<option value="1">1</option>
</select><span class="select2 select2-container select2-container--bootstrap select2-container--below" dir="ltr" style="width: 48px;"><span class="selection"><span class="select2-selection select2-selection--single" role="combobox" aria-haspopup="true" aria-expanded="false" tabindex="0" aria-labelledby="select2-DropDownList1-container"><span class="select2-selection__rendered" id="select2-DropDownList1-container" title="1">1</span><span class="select2-selection__arrow" role="presentation"><b role="presentation"></b></span></span></span><span class="dropdown-wrapper" aria-hidden="true"></span></span>
</div>
И все равно выглядит не так (без рамки, по-прежнему фон)
Я пытался работать с селектором начальной загрузки - но, похоже, .net игнорирует ВСЕ, что мы делаем для изменения класса.
У меня есть около 4 часов на изучение этого - и все еще ничего
Не могли бы вы помочь, пожалуйста? Попробую что угодно.
Пожалуйста, предложите. Спасибо.