我正在尝试设计一个表单,在文本框中有一个按钮.我希望该按钮位于文本框内.这是我尝试的方式:
<div class="row">
<div class="col-sm-6">
<div class="form-group required">
<label for="PickList_Options" class="col-sm-4 control-label">Options</label>
<div class="col-sm-4 buttonwrapper">
<input type="text" class="form-control" id="PickList_Options" name="PickList_Options" value='' />
<button>GO</button>
</div>
</div>
</div>
<div class="col-sm-6">
<div class="result" id="mydiv"></div>
</div>
</div>
Run Code Online (Sandbox Code Playgroud)
我的css:
.buttonwrapper {
display:inline-block;
}
input,
button {
background-color:transparent;
border:0;
}
Run Code Online (Sandbox Code Playgroud)
但是,问题是,Go按钮位于文本框下方.我该怎么做才能把它放在文本框中?
我希望"Go"按钮位于文本框内.
我正在尝试组合两个Font Awesome图标,以创建一个堆栈.我正在尝试合并fa-calendar和fa-clock-o图标.这是因为,我需要一个日期时间的图标.
所以,为了结合它们,我尝试了这个:
HTML
<span class="icon-stack">
<i class="fa fa-calendar icon-stack-3x"></i>
<i class="fa fa-clock-o icon-stack-1x"></i>
</span>
Run Code Online (Sandbox Code Playgroud)
CSS
.icon-stack {
position: relative;
display: inline-block;
width: 2em;
height: 5em;
line-height: 4em;
vertical-align: middle;
}
.icon-stack-1x,
.icon-stack-2x,
.icon-stack-3x {
position: absolute;
left: 0;
width: 100%;
text-align: center;
}
.icon-stack-1x {
line-height: inherit;
}
.icon-stack-2x {
font-size: 1.5em;
}
.icon-stack-3x {
font-size: 2em;
}
Run Code Online (Sandbox Code Playgroud)
这就是我得到的结果.

但是,我想带一点点正确.我不知道怎么做?我能做些什么才能让它走向正确?
有没有办法在同一行显示页面长度选项和分页选项?这就是我得到的:
有没有办法覆盖他们的CSS并在同一行显示它们?它们都在两个独立的div中.我添加了"jquery.dataTables.min.css"和"bootstrap.min.css".
我正在创建一个表单,我有一个侧面导航栏.我有大约15-20个元素要显示.我想要<li>二合一.每个都<li>包含一个模态的链接.当<li>被点击时,一个模式打开.
这就是我写的:
<div id="sidebar-wrapper">
<ul class="sidebar-nav">
<h4 class="sidebar-brand">Select Field Type</h4>
<li><a href="#" data-toggle="modal" data-target="#SingleLine_Modal">Single Line</a></li>
<li><a href="#" data-toggle="modal" data-target="#PickList_Modal">Pick List</a></li>
<li><a href="#" data-toggle="modal" data-target="#MultiSelect_Modal">Multi Select</a></li>
<li><a href="#" data-toggle="modal" data-target="#MultiLine_Modal">Multi Line</a></li>
<li><a href="#" data-toggle="modal" data-target="#Email_Modal">Email</a></li>
<li><a href="#" data-toggle="modal" data-target="#Phone_Modal">Phone Number</a></li>
<li><a href="#" data-toggle="modal" data-target="#Mobile_Modal">Mobile Number</a></li>
<li><a href="#" data-toggle="modal" data-target="#Date_Modal">Date</a></li>
<li><a href="#" data-toggle="modal" data-target="#Time_Modal">Time</a></li>
<li><a href="#" data-toggle="modal" data-target="#DateTime_Modal">Date-Time</a></li>
<li><a href="#" data-toggle="modal" data-target="#CheckBox_Modal">Checkbox</a></li>
<li><a href="#" data-toggle="modal" data-target="#Radio_Modal">Radio</a></li>
<li><a href="#" data-toggle="modal" data-target="#Decimal_Modal">Decimal</a></li>
<li><a href="#" data-toggle="modal" data-target="#Number_Modal">Number</a></li>
<li><a href="#" …Run Code Online (Sandbox Code Playgroud) 我正在创建一个表格。我有两个字段,1.默认值字段和2.预览字段。两者都是多选字段。用户将手动将选项添加到多选中。每当用户选择默认值中的选项时,预览字段中应显示相同的值。当用户删除一个选项时,应取消选择同一选项。这就是我为此多选编写 onchange 事件的方式:
$("#MultiSelect_DefaultValues").change(function() {
alert($(this).val());
$("#MultiSelect_Preview").val($(this).val());
});
Run Code Online (Sandbox Code Playgroud)
我在警报中得到了正确的值。但是,预览场中却没有任何反应。默认值字段中可用的所有选项也可在预览字段中使用。但是,在默认值字段中选择的选项不会在预览字段中选择。这有什么问题吗?我应该更改什么,以便默认字段中的更改也反映在预览字段中?
我是离子-2的新手.我正在开发一个应用程序,用户必须在其中创建警报.为此,我创建了一个页面.该页面包含一个"+"按钮.单击该按钮时,将显示提示警报.截至目前,该提示警报有一个文本框和确定按钮.但是,而不是我需要显示日期时间选择器.我怎样才能做到这一点?任何帮助?
my html file:
<ion-header>
<ion-navbar color="primary">
<ion-title>Alarm</ion-title>
</ion-navbar>
</ion-header>
<ion-content padding>
<ion-fab right bottom>
<button ion-fab (click)="alarm()" color="vibrant" mini>
<ion-icon name="add"></ion-icon>
</button>
</ion-fab>
</ion-content>
my ts file:
import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { AlertController } from 'ionic-angular';
@Component({
selector: 'page-wifi-controller-schedules',
templateUrl: 'wifi-controller-schedules.html'
})
export class AlarmsPage {
constructor(public navCtrl: NavController, public alertCtrl: AlertController) {}
alarm() {
let prompt = this.alertCtrl.create({
title: 'Login',
message: "Enter a name for this new album you're …Run Code Online (Sandbox Code Playgroud) css ×4
html ×2
angular ×1
datatables ×1
font-awesome ×1
fonts ×1
ionic2 ×1
javascript ×1
jquery ×1
stacked ×1