HTML Bootstrap使用html模板时出现问题

时间:2017-06-20 15:39:41

标签: javascript jquery html css twitter-bootstrap

我正在尝试将HTML模板导入我的index.html。模板将被放入包装器div中,但是包装器div将不再位于父div中创建的“井”内。

我需要导入模板,并且在“井”内而不是在外面。

感谢您的帮助。

的index.html:

<div class="row">
            <div id="parent" class=" well col-m-12">

                <h4>Experiment parameters</h4>
                <p>Full of input boxes which update both views above</p>

                <div id="wrapper" class="col-md-2">

                </div>
            </div>

模板:

<template class="section-template">
<!--need to change this name-->
<section id="input" class="wrapper style1 fullscreen intro">
    <div>
        <form class="form-horizontal">
            <div class="form-group">
                <label for="inputKi" class="col-sm-3 control-label">|Ki|</label>
                <div class="col-sm-6">
                    <input type="text" class="input-sm form-control" id="inputKi">
                </div>
                <label for="inputKi" class="col-sm-1 control-label">A</label>
            </div>
        </form>

        <form class="form-horizontal">
            <div class="form-group">
                <label for="inputKf" class="col-sm-3 control-label">|Kf|</label>
                <div class="col-sm-6">
                    <input type="text" class="input-sm form-control" id="inputKf">
                </div>
                <label for="inputKf" class="col-sm-1 control-label">A</label>
            </div>
        </form>

        <form class="form-horizontal">
            <div class="form-group">
                <label for="inputE" class="col-sm-3 control-label">E</label>
                <div class="col-sm-6">
                    <input type="text" class="input-sm form-control" id="inputE">
                </div>
                <label for="inputE" class="col-sm-1 control-label">meV</label>
            </div>
        </form>

        <form class="form-horizontal">
            <div class="form-group">
                <label for="inputQ" class="col-sm-3 control-label">|Q|</label>
                <div class="col-sm-6">
                    <input type="text" class=" input-sm form-control" id="inputQ">
                </div>
                <label for="inputE" class="col-sm-1 control-label">A</label>

            </div>
        </form>

    </div>
</section>
</template>

这就是它的样子:

enter image description here

0 个答案:

没有答案