如图。input文本框输入内容不显示,placeholder属性的值也没有显示,给input文本框加个什么css属性可以使这些内容显示出来?
以下是代码:
<div class="tpl-block ">
<div class="am-g tpl-amazeui-form">
<div class="am-u-sm-12 am-u-md-9">
<form class="am-form am-form-horizontal">
<div class="am-form-group">
<label for="user-name" class="am-u-sm-3 am-form-label">姓名 / Name</label>
<div class="am-u-sm-9">
<input type="text" class="input" id="user-name" placeholder="姓名 / Name">
<small>输入你的名字,让我们记住你。</small>
</div>
</div>
</form>
</div>
</div>
</div>
.tpl-content-wrapper {
padding-left: 255px;
padding-top: 10px;
}
.tpl-content-page-title {
color: #697882;
font-size: 22px;
font-weight: 400;
}
.am-breadcrumb {
padding: 0;
margin-top: 10px;
}
.am-breadcrumb {
padding: .7em .5em;
margin-bottom: 0rem;
list-style: none;
background-color: transparent;
border-radius: 0;
font-size: 85%;
}
.am-breadcrumb>li {
display: inline-block;
font-size:14px;
}
[class*=am-icon-] {
display: inline-block;
font-style: normal;
}
a {
color: #337ab7;
}
.tpl-content-span {
display: inline-block;
margin-top: 17px;
margin-left: 20px;
margin-right: 5px;
padding: 0;
list-style: none;
}
.am-breadcrumb>.am-active {
color: #999;
}
.am-breadcrumb>li [class*=am-icon-]:before {
color: #999;
margin-right: 5px;
}
.am-breadcrumb li a{
font-size:14px;
}
.am-icon-home:before {
/content: "\f015";/
}
[class*=am-icon-]:before {
display: inline-block;
font: normal normal normal 1.6rem/1 FontAwesome,sans-serif;
font-size: inherit;
text-rendering: auto;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
-webkit-transform: translate(0,0);
-ms-transform: translate(0,0);
transform: translate(0,0);
}
:after, :before {
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.am-breadcrumb>li+li:before {
content: "\00bb\00a0";
padding: 0 8px;
color: #ccc;
}
a:hover{
text-decoration:none;
}
.tpl-portlet-components {
border: 1px solid #e7ecf1;
padding: 12px 20px 15px;
background-color: #fff;
margin-top: 0;
margin-bottom: 25px;
overflow: hidden;
width:980px;
}
.tpl-portlet-components .portlet-title {
border-bottom: 1px solid #eef1f5;
padding: 0;
min-height: 48px;
margin-bottom: 10px;
}
.tpl-portlet-components .portlet-title .caption {
float: left;
display: inline-block;
font-size: 18px;
line-height: 18px;
color: #666;
padding: 10px 0;
}
.font-green {
color: #133857!important;
}
.bold {
font-weight: 700!important;
}
.font-green {
color: #133857!important;
}
.tpl-fz-ml {
margin-left: 30px;
}
.tpl-portlet-input {
float: right;
display: inline-block;
padding: 4px 0;
}
.tpl-block {
padding-top: 10px;
padding-bottom: 10px;
font-size: 18px;
}
.am-g {
margin: 0 auto;
width: 100%;
}
.am-u-md-6 {
width: 50%;
}
.am-u-sm-12 {
width: 100%;
}
[class*=am-u-] {
padding-left: 1.5rem;
padding-right: 1.5rem;
}
[class*=am-u-] {
width: 100%;
padding-left: 1rem;
padding-right: 1rem;
float: left;
position: relative;
}
.am-btn-toolbar {
margin-left: -5px;
}
.am-btn-toolbar>.am-btn, .am-btn-toolbar>.am-btn-group, .am-btn-toolbar>.am-input-group {
margin-left: 5px;
}
.am-btn-toolbar .am-btn-group, .am-btn-toolbar .am-input-group {
float: left;
}
.am-btn-group, .am-btn-group-stacked {
position: relative;
display: inline-block;
vertical-align: middle;
}
.am-btn-group>.am-btn:first-child:not(:last-child):not(.am-dropdown-toggle) {
border-bottom-right-radius: 0;
border-top-right-radius: 0;
}
.am-btn-group>.am-btn:first-child {
margin-left: 0;
}
.am-btn-group-xs>.am-btn {
font-size: 0.2rem;
}
.am-btn-group-stacked>.am-btn, .am-btn-group>.am-btn {
position: relative;
float: left;
}
.am-btn-group .am-btn-default, .am-btn-group-stacked .am-btn-default {
border-color: #d9d9d9;
}
.am-btn-default {
color: #444;
background-color: #e6e6e6;
border-color: #e6e6e6;
}
.am-btn {
display: inline-block;
margin-bottom: 0;
padding: .5em 1em;
vertical-align: middle;
font-size: 0.8rem;
font-weight: 400;
line-height: 1.2;
text-align: center;
white-space: nowrap;
background-image: none;
border: 1px solid transparent;
border-radius: 0;
cursor: pointer;
outline: 0;
-webkit-appearance: none;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-transition: background-color .3s ease-out,border-color .3s ease-out;
transition: background-color .3s ease-out,border-color .3s ease-out;
}
.am-input-group .am-btn-success {
background: #fff;
border-color:#d9d9d9;
color:#232323;
}
.am-input-group .am-btn-success:hover {
background: #d9d9d9;
border-color:#d9d9d9;
color:#232323;
}
.am-input-group .am-input-group-btn .am-btn-success {
background: #154268;
border-color:#154268;
color:#fff;
}
.am-input-group .am-input-group-btn .am-btn-success:hover {
background: #102e48;
border-color:#102e48;
color:#fff;
}
.table-main button {
background: #fff;
}
.table-main button:hover{
background:#d9d9d9;
}
.am-btn-group .am-btn-success, .am-btn-group-stacked .am-btn-success {
border-color: #4db14d;
}
.am-btn-success {
color: #fff;
background-color: #5eb95e;
border-color: #5eb95e;
}
.am-btn-success:hover {
background-color: #54a554;
border-color: #54a554;
}
button, input:not([type=radio]):not([type=checkbox]), select {
vertical-align: middle;
}
body, button, input, select, textarea {
text-rendering: optimizeLegibility;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
-moz-font-feature-settings: "liga","kern";
}
button, html input[type=button], input[type=reset], input[type=submit] {
-webkit-appearance: button;
cursor: pointer;
}
button, select {
text-transform: none;
}
button, input {
line-height: normal;
}
button {
overflow: visible;
}
button, input, optgroup, select, textarea {
color: inherit;
font: inherit;
margin: 0;
}
.am-btn-group>.am-btn:not(:first-child):not(:last-child):not(.am-dropdown-toggle) {
border-radius: 0;
}
.am-btn-group .am-btn+.am-btn, .am-btn-group .am-btn+.am-btn-group, .am-btn-group .am-btn-group+.am-btn, .am-btn-group .am-btn-group+.am-btn-group {
margin-left: -1px;
}
.am-btn-group-stacked>.am-btn, .am-btn-group>.am-btn {
position: relative;
float: left;
}
.am-btn-group .am-btn-secondary, .am-btn-group-stacked .am-btn-secondary {
border-color: #23abf0;
}
.am-btn-secondary {
color: #fff;
background-color: #3bb4f2;
border-color: #3bb4f2;
}
.am-btn-secondary:hover {
background-color: #399acc;
border-color: #399acc;
}
.am-btn-group .am-btn-warning, .am-btn-group-stacked .am-btn-warning {
border-color: #ea6e0c;
}
.am-btn-warning {
color: #fff;
background-color: #F37B1D;
border-color: #F37B1D;
}
.am-btn-warning:hover {
background-color: #e4741d;
border-color: #e4741d;
}
.am-btn-group .am-btn-danger, .am-btn-group-stacked .am-btn-danger {
border-color: #d93c37;
}
.am-btn-danger {
color: #fff;
background-color: #dd514c;
border-color: #dd514c;
}
.am-btn-danger:hover {
background-color: #c24743;
border-color: #c24743;
}
[class*=am-u-]+[class*=am-u-]:last-child {
float: right;
}
.am-input-group {
border-radius: 3px;
overflow: hidden;
}
.am-input-group {
position: relative;
display: table;
border-collapse: separate;
}
.am-input-group .am-form-field:first-child, .am-input-group-btn:first-child>.am-btn, .am-input-group-btn:first-child>.am-btn-group>.am-btn, .am-input-group-btn:first-child>.am-dropdown-toggle, .am-input-group-btn:last-child>.am-btn-group:not(:last-child)>.am-btn, .am-input-group-btn:last-child>.am-btn:not(:last-child):not(.dropdown-toggle), .am-input-group-label:first-child {
border-bottom-right-radius: 0;
border-top-right-radius: 0;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.am-input-group-sm>.am-form-field, .am-input-group-sm>.am-input-group-btn>.am-btn, .am-input-group-sm>.am-input-group-label {
height: 33px;
font-size: 0.79rem!important;
}
.am-input-group .am-form-field, .am-input-group-btn>.am-btn {
height: 38px;
padding-bottom: auto;
}
.am-input-group .am-form-field, .am-input-group-btn, .am-input-group-label {
display: table-cell;
}
.am-input-group .am-form-field {
position: relative;
z-index: 2;
float: right;
/width: 100%;/
margin-bottom: 0;
}
.am-input-group-btn {
position: relative;
font-size: 0;
white-space: nowrap;
}
.am-input-group-btn, .am-input-group-label {
width: 1%;
white-space: nowrap;
vertical-align: middle;
}
.am-input-group .am-form-field, .am-input-group-btn, .am-input-group-label {
display: table-cell;
}
.am-input-group-sm>.am-form-field, .am-input-group-sm>.am-input-group-label {
height: 23px;
font-size: 0.79rem!important;
}
.am-input-group-btn:last-child>.am-btn, .am-input-group-btn:last-child>.am-btn-group {
margin-left: -1px;
}
.am-input-group .am-form-field:last-child, .am-input-group-btn:first-child>.am-btn-group:not(:first-child)>.am-btn, .am-input-group-btn:first-child>.am-btn:not(:first-child), .am-input-group-btn:last-child>.am-btn, .am-input-group-btn:last-child>.am-btn-group>.am-btn, .am-input-group-btn:last-child>.am-dropdown-toggle, .am-input-group-label:last-child {
border-bottom-left-radius: 0;
border-top-left-radius: 0;
}
.am-u-sm-12 {
width: 100%;
}
[class*=am-u-] {
padding-left: 1.5rem;
padding-right: 1.5rem;
}
[class*=am-u-] {
width: 100%;
padding-left: 1rem;
padding-right: 1rem;
float: left;
position: relative;
}
.am-table {
width: 100%;
margin-bottom: 1.6rem;
border-spacing: 0;
border-collapse: separate;
}
table {
max-width: 100%;
background-color: transparent;
empty-cells: show;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
.table-main {
font-size: 0.8rem;
padding: .5rem;
}
.am-table>caption+thead>tr:first-child>td, .am-table>caption+thead>tr:first-child>th, .am-table>colgroup+thead>tr:first-child>td, .am-table>colgroup+thead>tr:first-child>th, .am-table>thead:first-child>tr:first-child>td, .am-table>thead:first-child>tr:first-child>th {
border-top: 0;
}
.am-table>thead>tr>th {
vertical-align: bottom;
border-bottom: 1px solid #ddd;
}
.am-table>tbody>tr>td, .am-table>tbody>tr>th, .am-table>tfoot>tr>td, .am-table>tfoot>tr>th, .am-table>thead>tr>td, .am-table>thead>tr>th {
padding: .7rem;
line-height: 1.6;
vertical-align: top;
border-top: 1px solid #ddd;
}
.table-check {
width: 30px;
}
th {
text-align: left;
}
.table-id {
width: 50px;
}
.am-table-striped>tbody>tr:nth-child(odd)>td, .am-table-striped>tbody>tr:nth-child(odd)>th {
background-color: #f9f9f9;
}
input[type=checkbox], input[type=radio] {
margin: 4px 0 0;
margin-top: 1px\9;
line-height: normal;
}
input[type=checkbox], input[type=radio] {
cursor: pointer;
padding: 0;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.am-table-striped>tbody>tr:nth-child(odd)>td, .am-table-striped>tbody>tr:nth-child(odd)>th {
background-color: #f9f9f9;
}
.am-table>tbody>tr>td, .am-table>tbody>tr>th, .am-table>tfoot>tr>td, .am-table>tfoot>tr>th, .am-table>thead>tr>td, .am-table>thead>tr>th {
border-top: 1px solid #F2F5F8;
color: #133857;
}
.am-table>tbody>tr>td, .am-table>tbody>tr>th, .am-table>tfoot>tr>td, .am-table>tfoot>tr>th, .am-table>thead>tr>td, .am-table>thead>tr>th {
padding: .7rem;
line-height: 1.6;
vertical-align: top;
border-top: 1px solid #ddd;
}
.am-cf:after {
clear: both;
}
.am-cf:after, .am-cf:before {
content: " ";
display: table;
}
.am-fr {
float: right;
}
.am-pagination {
position: relative;
}
.am-pagination {
padding-left: 0;
margin: 1.5rem 0;
list-style: none;
color: #999;
text-align: left;
}
.am-pagination>li {
display: inline-block;
}
.am-pagination>li>a, .am-pagination>li>span {
position: relative;
display: block;
padding: .5em 0.7em;
text-decoration: none;
line-height: 1.2;
background-color: #fff;
border: 1px solid #ddd;
border-radius: 3px;
margin-bottom: 5px;
margin-right: 5px;
}
.tpl-pagination .am-disabled a, .tpl-pagination li a {
color: #133857;
border-radius: 3px;
padding: 6px 12px;
}
.am-pagination .am-active a {
z-index: 2;
color: #fff;
background-color: #133857;
border-color: #133857;
}
.tpl-pagination li a:hover {
background-color:#eee;
}
.am-pagination .am-active a:hover {
z-index: 2;
color: #fff;
background-color: #0e2b42;
border-color: #0e2b42;
}
.am-pagination .am-disabled a:hover {
color: #133857;
border-radius: 3px;
padding: 6px 12px;
}
.am-text-secondary {
color: #133857;
}
.am-text-danger {
color: #dd514c;
}
.am-table-hover>tbody>tr:hover>td,.am-table-hover>tbody>tr:hover>th{
background-color:#e9e9e9
}
.add-on, textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], input[type="file"], .uneditable-input {
border-color: #e4e6eb !important;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
}
input[placeholder], [placeholder], [placeholder] {
color: #fff !important;
}
.tpl-amazeui-form small {
font-size: 12px;
color:red;
display:none;
}
small {
font-size: 80%;
}
.am-u-sm-push-3 {
left: 33%;
margin-top: 24px;
}
.am-u-sm-9 {
width: 75%;
}
.am-btn-primary {
color: #fff;
background-color: #133857;
border-color: #133857;
}
.am-form-group label{
color:#133857;
}
.am-form-label{
width: 160px;
height: 35px;
}
.am-u-sm-9 .input{
width:300px;
}
.am-u-sm-9 textarea{
width:300px;
}