html中如何用css让文本框有立体的感觉

html-css07

html中如何用css让文本框有立体的感觉,第1张

<style

type="text/css">

INPUT.smallInput

{

BACKGROUND-COLOR:#FFFFFF

COLOR:#000000

FONT-SIZE:9pt

FONT-WEIGHT:Normal

TEXT-DECORATION:None

FOTN-FAMILY:宋体,verdana,Arial,

Helvetica

TEXT-ALIGN:Left

BORDER-TOP:3

Hidden

#808080

BORDER-LEFT:3

Hidden

#808080

BORDER-RIGHT:3

Hidden

#FFFFFF

BORDER-BOTTOM:3

Hidden

#FFFFFF

CURSOR:Text

}

</style>

这个css样式是

--单行文本框设置代码--,你可以修改一下做出自己想要的效果

,然后你的文本框调用这个样式就可以了

可以给标签家个id或class就可以调整文本框的宽和高。

如:

<style type="text/css">

.text1{width:100pxheight:20px}

</style>

<input type="text" class="text1" />

扩展资料:

在CSS中,使用text-align属性控制文本的水平方向的对齐方式:左对齐、居中对齐、右对齐。

该属性通过指定行框与哪个点对齐,从而设置块级元素内文本的水平对齐方式。通过允许用户代理调整行内容中字母和字之间的间隔,可以支持值 justify;不同用户代理可能会得到不同的结果。

默认值:left if direction is ltr, and right if direction is rtl 

继承:yes 

版本:CSS1 

JavaScript 语法:object.style.textAlign="right" 

参考资料来源:百度百科-text-align