Question

我正在进行搜索下拉菜单，需要输入一些关键字并允许用户选择他想要的日期范围。但是因为我添加了这一行：

<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>

现在一切正常，除了用户在白色输入字段上有白色文字这一事实。

我正考虑两种解决方案，

我可以选择导入的脚本会影响哪个分区吗？如果是这样，怎么样？
不是真正想要的解决方案：用白色以另一种颜色更改字段输入的颜色？

＆＃13;

<div id="advancedResearchContent" class="searchnav w3-theme-d5" style="display:none">
  <span style="position:absolute; left:35%; width:200px; top:100px;">Keywords</span><br><input type="text" id="keyword" style="position:absolute; left:42%; width:200px; top:100px;"></input>
  <span style="position:absolute; left:49%; width:200px; top:180px;">From date</span><br>
  <!--         <input type="text" id="dateBegin" style="position:absolute; left:57%; width:200px; top:180px;"></input> -->
  <div class="form-group">
    <!-- style="width:20px" -->
    <div class='input-group date' id='datetimepicker1' style="position:absolute; left:57%; width:220px; top:180px;">
      <input type='text' class="form-control" />
      <span class="input-group-addon">
                <span class="glyphicon glyphicon-calendar"></span>
      </span>
    </div>
  </div>
  <span style="position:absolute; left:75%; width:200px; top:180px;">To date</span><br>
  <!--         <input type="text" id="dateEnd" style="position:absolute; left:80%; width:200px; top:180px;"></input> -->
  <div class="form-group">
    <div class='input-group date' id='datetimepicker2' style="position:absolute; left:80%; width:220px; top:180px;">
      <input type='text' class="form-control" />
      <span class="input-group-addon">
                <span class="glyphicon glyphicon-calendar"></span>
      </span>
    </div>
  </div>


  <span style="position:absolute; left:50%; width:200px; top:280px;">Author</span><br><input type="text" id="author" style="position:absolute; left:57%; width:200px; top:280px;"></input>
  <input type="submit" value="Submit" id="popUpYes" style="border-radius: 5px; position: absolute; top: 280px; left:80%; width: 200px; height:40px;"></input>
  <div id="myDIV" class="header" style="background-color: #1f2c47; height:80px;  width: 510px; margin-left:7%;">
    <h4 style="margin:0px">Primary tag</h4>


    <select id="primarytag">
      <!--   <select id="primarytag"> -->
      <option selected disabled>Select primarytag:</option>
      <option value="Mathematics">Mathematics</option>
      <option value="Physics">Physics</option>
      <option value="Chemistry">Chemistry</option>
      <option value="Biology">Biology</option>
      <option value="Philosophy">Philosophy</option>
      <option value="History">History</option>
      <option value="Geography">Geography</option>
    </select>

    <!--             <input type="text" id="myInput1" placeholder="" style="z-index:1"></input> -->
    <span onclick="newElement1()" class="addBtn" style="border-radius: 0px; height:30px">Add</span>
  </div>
  <ul id="myUL1" style="width: 510px; margin-left:7%;">
  </ul>
  <br><br>
  <div id="myDIV" class="header" style="background-color: #263659; height:80px;  width: 510px; margin-left:7%;">
    <h4 style="margin:0px">Secondary tags</h4>
    <select id="secondarytag">
      <option selected disabled>Select secondarytag:</option>
      <option value="Mathematics">Mathematics</option>
      <option value="Physics">Physics</option>
      <option value="Chemistry">Chemistry</option>
      <option value="Biology">Biology</option>
      <option value="Philosophy">Philosophy</option>
      <option value="History">History</option>
      <option value="Geography">Geography</option>
    </select>

＆＃13;

与bootstrap.css冲突

0 个答案: