Javascript 引导使文本看起来像按钮

Javascript 引导使文本看起来像按钮,javascript,jquery,html,twitter-bootstrap,Javascript,Jquery,Html,Twitter Bootstrap,我正在使用这种语法,但出于某种原因,它使我的文本看起来像一个按钮。我想要的是文本只显示为文本-带白色背景的黑色文本。如何更改此语法,使文本不具有与按钮相同的大纲 <div class="col-md-2 col-xs-2"> <div class="input-group"> <span class="input-group-addon">Date One:</span> <input type="date" n

我正在使用这种语法,但出于某种原因,它使我的文本看起来像一个按钮。我想要的是文本只显示为文本-带白色背景的黑色文本。如何更改此语法,使文本不具有与按钮相同的大纲

<div class="col-md-2 col-xs-2">
   <div class="input-group">
      <span class="input-group-addon">Date One:</span>
      <input type="date" name="dateone" />
   </div>
</div>
<div class="col-md-4 col-xs-4"></div>
<div class="col-md-2 col-xs-2">
   <div class="input-group">
      <span class="input-group-addon">Date Two:</span>
      <input type="date" name="datetwo" />
      <span class="input-group-btn">
      <input type="submit" name="getthat" value="Show Me Info">
      </span>
   </div>
</div>

日期一:
日期二:
在这里,我还创建了引导提琴来展示视觉效果:


.input-group-addon_1{
宽度:1%;
空白:nowrap;
垂直对齐:中间对齐;
}
.input-group-addon_1{
填充:6px 12px;
字体大小:14px;
字体大小:正常;
线高:1;
颜色:#555;
文本对齐:居中;
}
日期一:
日期二:

.input-group-addon_1{
宽度:1%;
空白:nowrap;
垂直对齐:中间对齐;
}
.input-group-addon_1{
填充:6px 12px;
字体大小:14px;
字体大小:正常;
线高:1;
颜色:#555;
文本对齐:居中;
}
日期一:
日期二:
试试这个

  .input-group-addon 
  {
    background-color: #fff;
    border: 0px solid #ccc;
    border-radius: 0px;
  }
在css文件中添加此类 或 还可以将类用于特定的输入组

 .col-md-2  > .input-group > .input-group-addon 
  {
   background-color: #fff;
   border: 0px solid #ccc;
   border-radius: 0px;
  }
试试这个

  .input-group-addon 
  {
    background-color: #fff;
    border: 0px solid #ccc;
    border-radius: 0px;
  }
在css文件中添加此类 或 还可以将类用于特定的输入组

 .col-md-2  > .input-group > .input-group-addon 
  {
   background-color: #fff;
   border: 0px solid #ccc;
   border-radius: 0px;
  }

只需将
输入组插件更改为
输入组

<div class="col-md-2 col-xs-2">
   <div class="input-group">
      <span class="input-group">Date One:</span>
      <input type="date" name="dateone" />
   </div>
</div>
<div class="col-md-4 col-xs-4"></div>
<div class="col-md-2 col-xs-2">
   <div class="input-group">
      <span class="input-group">Date Two:</span>
      <input type="date" name="datetwo" />
      <span class="input-group-btn">
      <input type="submit" name="getthat" value="Show Me Info">
      </span>
   </div>
</div>

日期一:
日期二:

工作小提琴

只需将
输入组插件
更改为
输入组

<div class="col-md-2 col-xs-2">
   <div class="input-group">
      <span class="input-group">Date One:</span>
      <input type="date" name="dateone" />
   </div>
</div>
<div class="col-md-4 col-xs-4"></div>
<div class="col-md-2 col-xs-2">
   <div class="input-group">
      <span class="input-group">Date Two:</span>
      <input type="date" name="datetwo" />
      <span class="input-group-btn">
      <input type="submit" name="getthat" value="Show Me Info">
      </span>
   </div>
</div>

日期一:
日期二:

工作小提琴

你的问题在哪里?文本日期一:和日期二:有灰色背景/轮廓,因此它更倾向于按钮的外观,而不是文本。好吧,你正在做的是使用。这就是它看起来的样子。如果你不想让它看起来像那样,就用别的东西?@JamesThorpe-啊,我不知道那是罪魁祸首。你的示例链接中没有日期1或日期2,你能更新它来表示问题吗?你的问题在哪里?文本日期1:和日期2:具有灰色背景/轮廓,因此它更倾向于按钮的外观,而不是文本。嗯,你所做的就是使用。这就是它看起来的样子。如果你不想让它看起来像那样,那就用别的东西?@JamesThorpe-啊,我不知道那是罪魁祸首。你的示例链接中没有日期1或日期2,你能更新它来表示问题吗?这会把文本放在日期的顶部-有可能把它们都放在一行吗?我只是在代码上做一个uodate…复制并粘贴,我使用我创建的自定义输入组加载项而不是输入组加载项这会将文本放在日期的顶部-是否可以将它们都放在一行上?我只是在代码中创建一个uodate…复制并粘贴,我使用我创建的自定义输入组加载项而不是输入组加载项