我有这个 HTML 片段：<!DOCTYPE html><html><head> <meta charset="UTF-8"> <link rel="stylesheet" href="https://unpkg.com/onsenui/css/onsenui.css"> <link rel="stylesheet" href="https://unpkg.com/onsenui/css/onsen-css-components.min.css"> <script src="https://unpkg.com/onsenui/js/onsenui.min.js"></script> <script src="https://unpkg.com/jquery/dist/jquery.min.js"></script></head><body> <p> Label for select: <ons-select id="any_id" modifier="material"> <option value="0">Value 0</option> <option value="1">Value 1</option> <option value="2">Value 2</option> </ons-select> </p></body></html>产生这个：正如您所看到的，文本没有正确对齐ons-select。我怎样才能让它们显示在一行上？
1 回答
桃花长相依
TA贡献1860条经验 获得超8个赞
使用 flexbox 来处理这种类型的事情。非常容易实施。
div{
display:flex;
align-items:center;
}
<html>
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="https://unpkg.com/onsenui/css/onsenui.css">
<link rel="stylesheet" href="https://unpkg.com/onsenui/css/onsen-css-components.min.css">
<script src="https://unpkg.com/onsenui/js/onsenui.min.js"></script>
<script src="https://unpkg.com/jquery/dist/jquery.min.js"></script>
</head>
<body>
<div>
Label for select:
<ons-select id="any_id" modifier="material">
<option value="0">Value 0</option>
<option value="1">Value 1</option>
<option value="2">Value 2</option>
</ons-select>
</div>
</body>
</html>
- 1 回答
- 0 关注
- 72 浏览
添加回答
举报
0/150
提交
取消