<!DOCTYPE html>
<html>
<head>
<title>Bootstrap 实例</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/4.1.0/css/bootstrap.min.css">
<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
<script src="https://cdn.bootcss.com/popper.js/1.12.5/umd/popper.min.js"></script>
<script src="https://cdn.bootcss.com/bootstrap/4.1.0/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container mt-3">
<h2>自定义选择菜单</h2>
<p>如果我们要设置自定义选择菜单大小，可以使用 .custom-select-sm、.custom-select-lg 来设置它们的大小:</p>
<form action="action_page.php">
<select name="cars" class="custom-select">
<option selected>自定义选择菜单</option>
<option value="Google">Google</option>
<option value="Runoob">Runoob</option>
<option value="Taobao">Taobao</option>
</select><br><br>
<p>自定义上传样式</p>
<div class="custom-file mb-3">
<input type="file" class="custonm-file-input" id="customFile" name="filename">
<label for="customFile" class="custom-file-label">选择文件</label>
</div>
<p>默认上传样式</p>
<input type="file" id="my-file" name="filename1"><br><br>
<label for="customRange">自定义滑块控件</label>
<input type="range" class="custom-range" id="customRange"><br><br>
<button type="submit" class="btn btn-primary">
提交
</button>
</form>
</div>
</body>
</html>action="action_page.php"：设置404错误
custom-select：选择（下拉）菜单
custom-file custonm-file-input custom-file-label：自定义表单控件
<input type="file" class="custonm-file-input" id="customFile" name="filename">：自定义文件上传样式
custom-range customRange：滑块控件