移动端怎么设置一个div自适应窗口大小

高度自适应

第1个回答  2015-07-23
用width:100%可不可以?追问

是自适应窗口的高度。div里面什么都没有的情况下

追答

我一般是用js写的 比如宽高比是二比一 即width:100px;height:50px 那么可以用js判断当前div的宽度,高度就是当前宽度除以2,然后用js给这个div追加高度样式
剩下的就是搜一下怎么用js获取div的宽度 怎么用js给div追加样式即可

追问

嘿嘿。我做出来。谢谢您。可能是我没有表达清楚吧。一个空div自适应各种屏幕。

本回答被提问者采纳

html5移动端div的高度怎么设置自适应
如果是想适配不同设备的窗口大小,可以设置百分比。或者通过position定位,然后设置top和bottom值。再或者利用css3的flexbox布局,设置父级的display为flex,方向为纵的,然后设置其flex:1;

div如何自适应屏幕div自适应屏幕宽度
1、先新建一个html文件,并在head中添加样式表【styletype="text\/css">\/style>】。2、在body中添加一个DIV,并引入一个CSS,命名为【aaa】。3、给这个DIV添加背景色,并定义它的宽和高。【background:#FA2;width:400px;height:600px;】。4、然后添加如下代码。【position:fixed;left:50%;top:...

如何设置div的宽高自适应屏幕大小
照你的要求:一屏分为两栏显示,那么用两个DIV来做,一个DIV的宽度就是50%,两个在一起就正好100%了,如果你想这两个DIV之间有间距,那么就设置宽度为48%就行,具体自己把握,然后设置左边的DIV左浮动,右边的DIV右浮动即可。高度是可以设置固定像素的,比如一个div的宽度为48%,高度为50px都行...

怎样让手机版网页自适应手机屏幕宽度?
在手机上不能固定宽度,要按百分比写页面宽度。才能自适应设备。主要是这两点,当然细节上面还有很多和PC端不一样的地方。指向文件错误,比如你的网页文件在A,但是你却指向了B。你把指向的文件放到网页文件内在试试。如果下载下来的图片大小规格完全一样的话,在photoshop中设置一个动作,就能批量处理了。

怎么让div根据外部td自动放大缩
div层自动适应窗口大小,可以使用height:auto属性来自适应,示例如下:<style type="text\/css">.FGH { height:auto !important; height:344px; min-height:344px; }<\/style> 调用方法: <div class="FGH">Div+Css自适应高度,最小高度的方法 (兼容所有浏览器) <\/div> ...

如何给div设置最小宽度,如果超出宽度自适应
一个div容器,如果给这个容器设置一个最小宽度,如果内容没有超出就是这个最小宽度,如果超出了容器就会自动适应内容的宽度

如何让div高度自适应
四种方法:1、增加一个清除浮动,让父容器知道高度;2、增加一个容器,在代码中存在,但在视觉中不可见;3、增加一个BR并设置样式为clear:both;4、设置一个足够高的高度,并在父级元素中清除溢出的部分。

如何使div的位置随浏览器窗口缩放大小比例变化???
要使元素的位置随着浏览器窗口的缩放大小比例变化,你可以使用 CSS 中的相对定位和百分比单位来实现。以下是一种常见的方法:HTML:CSS:.my-div { position: relative;top: 50%;left: 50%;transform: translate(-50%, -50%);width: 50%;height: 50%;background-color: #f0f0f0;} 在上面的...

怎样让一个div高度自适应浏览器高度
<\/div> 增加一个BR并设置样式为clear:both。<div id="main"> <div id="content"><\/div> <br style="clear:both;" \/> <\/div>以上三个方法都不是最好的解决方法,因为在程序代码观念中是提倡尽量不要添加无意义的标签代码。现在,你可以用下面的方法来实现DIV自适应高度效果#main {height:100...

div设置高度自适应?
怎样让一个div高度自适应浏览器高度这个方法就大致分为两种吧,第一种,用CSS的方法 第二种,用JS方法 这里暂时只演示第一种,如果第二种,另外@我 示例代码如下:CSS代码第一种写法 html,body{height:100%;margin:0;}\/**把HTML和BODY的高度设置成100%**\/ div{height:100%;background-color:#...

相似回答