div 设置百分比 怎么不出滚动条,不设置div的宽高,怎么让div 显示滚动条呢?

 我来答
百度网友76238c021
2017-11-23 · TA获得超过215个赞
知道小有建树答主
回答量:296
采纳率:75%
帮助的人:72.4万
展开全部
方法一:
你可以 用js获取浏览器宽高,用这个宽高减去padding 、margin 宽高和一些控件的宽高,从而将这个宽高 动态赋给 div 。
以下是获取浏览器或窗口的代码:
// 获取窗口宽度if (window.innerWidth)winWidth = window.innerWidth;else if ((document.body) && (document.body.clientWidth))winWidth = document.body.clientWidth;// 获取窗口高度if (window.innerHeight)winHeight = window.innerHeight;else if ((document.body) && (document.body.clientHeight))winHeight = document.body.clientHeight;// 通过深入 Document 内部对 body 进行检测,获取窗口大小if (document.documentElement && document.documentElement.clientHeight && document.documentElement.clientWidth){winHeight = document.documentElement.clientHeight;winWidth = document.documentElement.clientWidth;}
或者百度js窗口高度
方法二:响应式来做,可以根据媒体查询,设定在不同屏幕宽度下div的高度和宽度,具体的设置看你响应式想怎么显示

@media only screen and (min-width: 100px) and (max-width: 640px) {
div{
width: 100px;
height: 100px;
}
}
@media only screen and (min-width: 641px) and (max-width: 789px) {
div{
width: 200px;
height: 200px;
}
}
方法三:百分比来做,这里需要运用一个小技巧,padding用百分比做单位时是相对于容器的宽度来算的,所以你可以把高度设为0,内容自然溢出,设置个padding-bottom

height:0;
width:50%;
padding-bottom:30%
那么这个div的高宽比就是30%:50%
这个方法多用在ifram 中
本回答被网友采纳
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
匿名用户
2013-05-13
展开全部
用CSS的overflow 。 以下下为复制的,供参考。 CSS overflow 属性
  定义
  overflow 属性设置当元素的内容溢出其区域时发生的事情。
  继承性:No
  说明
  这个属性定义溢出元素内容区的内容会如何处理。如果值为 scroll,不论是否需要,用户代理都会提供一种滚动机制。因此,有可能即使元素框中可以放下所有内容也会出现滚动条。
  JavaScript 语法
  CSS 属性也可通过一段 JavaScript 被动态地改变。
  脚本语法:
  object.style.overflow="hidden"
  在我们的 HTML DOM 教程中,您可以找到更多有关 overflow 属性 的细节。
  在我们的 HTML DOM 教程中,您也可以找到完整的 Style 对象参考手册。
  例子
  p
  {
  overflow: scroll
  }
  可能的值
  值 描述
  visible 默认。内容不会被修剪,会呈现在元素之外。
  hidden 内容会被修剪,但是浏览器不会显示供查看内容的滚动条。
  scroll 内容会被修剪,但是浏览器会显示滚动条以便查看其余的内容。
  auto 如果内容被修剪,则浏览器会显示滚动条以便查看其余的内容。 可以追问。
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式