html怎样对input样式进行样式

html-css018

html怎样对input样式进行样式,第1张

1.

可以直接定义input{color:#cccborder:

}等全局属性。所有Input的文本框都会应用该样式。

2.

可以定义某种类型文本框，比如

input[type='text']{}就是所有文本框类型为text的都应用该样式。

3.

可以直接给某个input添加class，然后给指定的class进行样式渲染，比如

那么就给

.inp-btn{}添加样式即可。

1楼回答的已经很好了。我补充一些要注意的。

1、为了兼容的需要，一般给input定了高度之后（比如：height:20px），还需要设置行高以确保文字垂直居中：line-height:20px 行高必须与高度保持一致。

2、例子： <input type="text" id="text" name="" size=“15” />所示中要注意写size的值，不然文字输入多了或造成溢出。（可能还有别的方式，不过我自己还没尝试过）

3、可以给每一个input定义一个选择器，以方便单独定义样式。

html: <input type="text" id="text" name="" size=“15” />

css: input#text{

color:#f00 /*红色文字*/

width:160px /*定义宽度*/

height:24px/*定义高度*/

line-height:24px/*定义行高，确保垂直居中*/

border:1px solid #dfdfdf /*定义边框，1像素，浅灰色 1楼设的灰色较深，一般不适合，白色背景来说，#dfdfdf的颜色之比较合适 */

font:normal 12px/24px "" /*定义字体，不加粗，12像素字，24像素行距，使用默认字体*/

}