我有一个文本输入

<input type="text" value="3" class="field left">

这是我的CSS

background:url("images/number-bg.png") no-repeat scroll 0 0 transparent;
border:0 none;
color:#FFFFFF;
height:17px;
margin:0 13px 0 0;
text-align:center;
width:17px; 

有什么设定或技巧吗,我想做一个标签,但是样式如何。我如何转换它们,有没有更好的方法或者这是唯一的方法?


当前回答

<input type="text" value="3" class="field left" readonly>

不需要造型。

参见MDN上<input> https://developer.mozilla.org/en/docs/Web/HTML/Element/input#Attributes

其他回答

你可以在输入中添加属性readonly:

<input type="text" value="3"
       class="field left" readonly="readonly">

更多信息: http://www.w3schools.com/tags/att_input_readonly.asp

如果你真的想使用CSS,使用下面的属性将使字段不可编辑。

pointer-events: none;

添加只读的:

<input type="text" value="3" class="field left" readonly>

如果希望该值不提交到表单中,可以添加disabled属性。

<input type="text" value="3" class="field left" disabled>

没有办法使用CSS总是能做到这一点。

为什么?CSS不能“禁用”任何东西。你仍然可以关闭显示或可见性并使用pointer-events:在ie11之前的版本中,除了pointer-events外没有任何方法可以工作。

<input type="text" value="3" class="field left" readonly>

你可以在https://www.w3schools.com/tags/att_input_readonly.asp上看到

设置“readonly”的方法:

$("input").attr("readonly", true)

取消“readonly”(在jQuery工作):

$("input").attr("readonly", false)

只读和禁用将工作。但如果你想发送输入值,只需使用readonly并编辑css .field left:focus{outline: none}