html - 在 Bootstrap 中创建和样式化输入作为句子的一部分？

Question

我想使用 Bootstrap 创建一个外语教学网站。该站点往往包含丰富的测验。我一直在创建非常适合文本的带下划线的输入字段。我搜索了 Stackoverflow 和 Google，但没有找到任何有用的信息。下图显示了我想要达到的效果:<input>样式为一行，插入句子中间。然后我会使用 Java/backend/sth检查答案。我该怎么做？

Answer 1

对于输入框的符号，您可以执行以下操作。这些是内联样式，但您可以将它们移出到 CSS 文件中。

<div>
    <div style="margin-bottom: 4px;">
    <label>Herr Lang</label> <input style="background-color: transparent; border-style: solid; border-width: 0px 0px 1px 0px; border-color: darkred;" value="" id="answer1"><label>bereits aus...</label>
    </div>
</div>

JSFiddle is here