• 技术文章 >web前端 >css教程

    css怎么设置文本框的宽和高

    青灯夜游青灯夜游2021-01-06 11:18:28原创5217

    css中可以使用width和height属性来设置文本框的宽和高,只需要给文本框元素(input或textarea)添加“width:值;”和“height:值;”样式即可。width属性可设置元素的宽度,height属性以设置元素的高度。

    本教程操作环境:Windows7系统、css1&&html5版本、Dell G3电脑。

    教程推荐:css视频教程

    css设置文本框宽度和高度的方法

    给文本框元素(<input>、<textarea>)设置width属性和height属性就可以调整文本框的宽和高。

    width属性设置元素的宽度,height属性设置元素的高度。

    3.png2.png

    注意: width属性和height属性不包括填充,边框,或页边距!

    示例:

    <!DOCTYPE html>
    <html>
     
    	<head>
    		<meta charset="UTF-8">
    		<style type="text/css">
    			.input{
    				width: 200px;
    				height: 100px;
    			}
    			.textarea{
    				idth: 200px;
    				height: 100px;
    			}
    		</style>
    	</head>
     
    	<body>
    		<input type="text" placeholder="默认单行文本框" />
    		<input type="text" class="input" placeholder="设置宽度200px,高度100px" /><br /><br />
    		<textarea placeholder="默认多行文本框"></textarea>
    		<textarea class="textarea" placeholder="设置宽度200px,高度100px"></textarea>
    	</body>
     
    </html>

    效果图:

    1.png

    更多编程相关知识,请访问:编程课程!!

    以上就是css怎么设置文本框的宽和高的详细内容,更多请关注php中文网其它相关文章!

    声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn核实处理。
    专题推荐:css html
    上一篇:css3兼容ie8吗 下一篇:border-radius是什么意思
    20期PHP线上班

    相关文章推荐

    精选22门好课,价值3725元,开通VIP免费学习!• HTML中内联元素有哪些• css怎么将字和图对齐• css怎么让文字不换行• html5包含css3吗• css right属性不起作用怎么办
    1/1

    PHP中文网