我正在尝试为 Web 应用程序创建前端。我已经有了用 python 开发的后端。我是这个网页设计/开发领域的新手
我有一些 html 和 javascript 代码,它们使用 jQuery multiselect.css 和 jQuery multiselect.js 创建下拉式多选 list 。但是我对如何更改下拉菜单的样式或位置感到困惑,因为我已经在使用 jQuery multiselect.css
我在head标签下添加了css和js
<link href="jquery.multiselect.css" rel="stylesheet">
<script src="jQuery.js"></script>
<script src="jQuery-MultiSelect-master/jquery.multiselect.js"></script>
然后我在 html 中创建下拉列表并使用 jQuery 对其进行初始化
<select id='testSelect1' multiple>
<option value='1'>Item 1</option>
<option value='2'>Item 2</option>
<option value='3'>Item 3</option>
<option value='4'>Item 4</option>
<option value='5'>Item 5</option>
</select>
<script src="./test.js"></script>
<script>
$('#testSelect1').multiselect({
columns: 4,
placeholder: 'Select Countries',
selectAll: true
});
</script>
这会将多选放在左侧,并使下拉宽度与页面宽度和高度一样宽,然后需要更长的时间。我正在尝试对其进行修改,使其出现在中间,并且下拉列表的大小没有那么小,下拉列表数组的颜色也不同
最佳答案
当您向元素添加样式和脚本时,它应该如下所示
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title></title>
<!-- style goes here -->
</head>
<body>
<!-- scripts go here -->
</body>
</html>
样式始终位于文档顶部,介于 <title></title>
之间标签。建议将脚本放在 <body>
之前标签关闭。 Here你可以读懂为什么
有那个..
如果您想首先设置下拉菜单的样式,我们需要看看它看起来是否正确,因为我们无法盲目地帮助您。但是你可以这样做
select {
<!-- style for select goes here -->
}
select option {
<!-- style for option goes here -->
如果你希望你的选择是300px
宽你可以添加这个
select {
width: 300px;
}
再次。如果这没有帮助,请发布一些屏幕截图并用它更新问题
关于javascript - 更改创建的多选下拉复选框的样式和位置,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58791845/