Html 如何将文本与选定内容对齐？_Html_Onsen Ui

Html 如何将文本与选定内容对齐？

html

Html 如何将文本与选定内容对齐？,html,onsen-ui,Html,Onsen Ui,我有以下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-

我有以下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:&nbsp;
        <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>



选择的标签：
值0
值1
价值2

这就产生了：

如您所见，文本未正确与ons select对齐。如何使它们显示在一行上？

使用flexbox进行此类操作。非常容易实现

div{
显示器：flex；
对齐项目：居中；
}


选择的标签：
值0
值1
价值2

谢谢。只需添加：您可以添加

justify content:center到css类以使其居中。