你要是想实现这个可以用JS
网页可见区域高：document.body.clientHeight
网页可见区域高：document.body.offsetHeight (包括边线的宽)
在Body标签里onsize=“yourfun()”
js里：
function yourfun()
{
用document.body.clientHeight取得高度
算出宽度后赋值给div就可以了
}
可以给标签家个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
通过css3的媒体查询功能。不同的分辨率之下赋予标签不同的背景图片，可以实现上述功能。
@media screen and (min-width: 1200px) {
body {
background: blue
}
}
例子是1200像素显示body为蓝色，background的值是可以为图片的。
想要有多个媒体查询，需要一个个的写上去，设置好不同的分辨率。
