html怎样对input样式进行样式

html-css010

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像素行距,使用默认字体*/

}