CSS怎么实现div随着网页的大小变化而变化呢?

我需要实现一个div使得这个div能够根据网页的放大缩小而变化。
2024-11-01 21:59:31
推荐回答(5个)
回答(1):

流体布局
布局

.one{width:80%; font-size:em(设置自体的大小,em可以让自体根据浏览器不同而更加优与阅读);}

.two{width:20%;font-size:em;}

注:通过这样设置,就可能拉动浏览器,盒模型的宽度就会随着你的拉动而变大缩小,但也是有一定限度的。

扩展资料:

关于div的用法

1、

可定义文档中的分区或节(division/section)。

2、

标签可以把文档分割为独立的、不同的部分。它可以用作严格的组织工具,并且不使用任何格式与其关联。

如果用 id 或 class 来标记

,那么该标签的作用会变得更加有效。

3、

是一个块级元素。这意味着它的内容自动地开始一个新行。实际上,换行是
固有的唯一格式表现。可以通过
的 class 或 id 应用额外的样式。

不必为每一个

都加上类或 id,虽然这样做也有一定的好处。

可以对同一个

元素应用 class 或 id 属性,但是更常见的情况是只应用其中一种。这两者的主要差异是,class 用于元素组(类似的元素,或者可以理解为某一类元素),而 id 用于标识单独的唯一的元素。

回答(2):

你说的是流体布局,这种布局的难度相对较高,因为都是百分比值,之前设计开始也要考虑周到,对于自体的大小,每个版块的值都要考虑在内。
举个例子,

流体布局
布局

.one{width:80%; font-size:em(设置自体的大小,em可以让自体根据浏览器不同而更加优与阅读);}
.two{width:20%;font-size:em;}
通过这样设置,就可能拉动浏览器,盒模型的宽度就会随着你的拉动而变大缩小,但也是有一定限度的,具体你可以自己去尝试,看看缩小到什么地步,盒子就会错位。

回答(3):

CSS实现div随着网页的大小变化而变化,首先我们需要了解div的width和height的属性设置,有一个auto参数,就是代表的是随着内容的大小而改变,浏览器缩小,自然div的宽度就会减小,高度就会有所增加,具体看下代码:






我是测试文字




回答(4):

简单,用width:auto; height:auto;不过,在这个DIV结束前,加一个

,不然不能自动增长(有些浏览器)

回答(5):

百分比可以,但就像前面网友说的,超过一个限度,内容就会错位