javascript 如何实现高度随着宽度的变化而变化,

js如何实现,如果width="200px"的话,height:也自动等于200px;

<style type="text/css">
#box li{ float:left;width: 100px; height: 100px; backgrounnd-color:#f60;}
</style>

<ul id='box'>
<li></li> 
<li></li>
<li></li>
</ul>
0

查看全部8条回答

Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
其他相关推荐
div高度随窗口变化而变化
一个CSSDiv布局的实例,让DIV的高度随浏览器窗口的变化而变化,窗口变大,Div的高度会变大,窗口变小则Div变小,貌似智能化。
让div的大小随着内容的变化而变化
*{ margin:0px; padding:0px; } div{ display: inline-block;行内块级元素 width: auto;                         height:auto;                        border: 1px solid #ccc; } 请问div的margin值是多少上来
css设置图片高随宽变化而变化
其实很简单,只需要设置宽的大小,像素也好,百分比也好,不设置高的大小,css就会自动按照图片的大小缩放比例。<style> img{ text-align:center; width: 60%; } .image{ text-align:center; width: 100%; overflow: hidden; } </style><div cla
DIV背景图片随DIV高度宽度变化而自动拉伸
 方法一:用css滤镜,问题是只支持IE5.5以上版本方法二:用两个层,一个放图片,用,为底部层;          另一个作页面显示层。建议用方法 西狐测试测试一下网页背景拉伸:) 实际使用后,发现有个需要注意的地方——使用AlphaImageLoader滤镜后,图片区域内的链接与按钮都将会失效,解决的办法是使用其他元素放置链接与按钮,浮动在该元素之上。 
实现div的大小随着内容进行动态改变
div的动态改变有两种方式:1.使用百分比的形式来实现div的动态改变的实现代码: #id{ width: 30%; height: 40%; } /* 这样一来,该div的宽度和高度将始终分别对应于浏览器的宽度的30%和40% */2.指定最小值来让浏览器自动实现div动态改变的实现代码: #id{ min-width: 100px; min-height: 200px; } /*
[css]CSS如何让DIV的宽度随内容的改变而改变
让div根据内容改变大小 div{ width:auto; display:inline-block !important; display:inline; }
js设置div大小随窗口大小变化
pageEncoding="utf-8"%> Insert title here $(function(){ var mydiv=$("#mydiv"); var mydiv_resize=function(){ $(mydiv).css("width",$(window).width()); $(mydiv).css("height",$(window).height())
动态获取div的高度 随着窗口变化而变化 window.resize
autodivheight(); function autodivheight(){ //函数:获取尺寸 //获取浏览器窗口高度 var winHeight=0; if (window.innerHeight){ winHeight = window.innerHeight; } else if ((document.body) && (document.body.clientH
左侧容器高度随着右侧容器的高度改变而改变
MJBlog(mj.588cy.com) * {margin:0;padding:0;font-size:12px;list-style:none;border:0;} body{font-family: Arial, Helvetica, sans-serif; background-color:#edf0eb;} a{ text-decoration:
textarea高度跟随文字高度而变化
html部分: 哈喽哈喽哈喽哈喽哈喽哈喽哈喽哈喽哈喽哈喽哈喽哈喽 js部分:     function makeExpandingArea(el) {    var setStyle = function(el) {        el.style.height = 'auto';        el.style.height = el.scrollHeight +
span中内容随着数字长度的增加而增大
场景:导航条中数据,当数据量不大时,只会显示几页,数字只有1,2,3,4..,数字写在span标签中, 则span不需要多宽,设置固定宽度就可以,但当数据量非常大的,例如:日志管理--有增 删 改就有记录,且记录会一直保存,不会删除。这时成千万的数据量显示,转到最后一行时,页数就可能为几百万条,显示7位数字,span标签宽度就要增加了,要随着数字长度的增加需增大。CSS设置,设置个最小宽度,内间距
实现页面左侧固定,右侧随浏览器宽度变化而变化的布局
&amp;lt;!DOCTYPE html&amp;gt; &amp;lt;html lang=&quot;en&quot;&amp;gt; &amp;lt;head&amp;gt; &amp;lt;meta charset=&quot;UTF-8&quot;&amp;gt; &amp;lt;title&amp;gt;Title&amp;lt;/title&amp;gt; &amp;lt;style&amp;gt; .box{ width: 8
CSS两侧固定宽度高随父元素变化,中间宽度随窗口宽度变化而变化布局效果
效果如下:代码如下:<!DOCTYPE html> <html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no, minimum-scale=1.0, maximum-scale=
【JavaScript】真正实现网页字体大小跟随屏幕变化而变化
方法一:     使用媒体查询Media获取屏幕宽度,根据不同屏幕下情况,给元素赋值不同字体大小, @media screen and (min-width:640px){ .IRYFloat P{ font-size: 3.0rem; } }   方法二:利用JS动态变化调整: &amp;lt;script t...
jquery插件-div跟随屏幕宽度变化
html: &amp;lt;!DOCTYPE html&amp;gt; &amp;lt;html&amp;gt;     &amp;lt;head&amp;gt;         &amp;lt;meta charset=&quot;utf-8&quot; /&amp;gt;         &amp;lt;title&amp;gt;&amp;lt;/title&amp;gt;         &amp;lt;script type=&quot;text/javascript&quot; src=&quo
使用背景图片,图片高度随宽度自动变化,并居中缩放,不变形
item{    width:100%; height:0; padding-bottom:41.8%; overflow:hidden; background-position:50%; background-repeat:no-repeat; background-size:cover; }
div随着浏览器窗口大小变更,改变大小(resize)
浏览器的放大缩小会导致网页布局变动,jquery的resize()方法,可以根据浏览器的窗口大小的变动,对网页进行操作:以下是div随着浏览器窗口大小变更,改变大小(resize)的案例:html:js效果:resizeDiv的块会根据网页变更,大小也随之改变...
input宽度随文字变化而变化
<input type="text" class="form-control"> <script> var searchinput=$("input"); var textWidth = function (text) { var sensor = $('<pre>' + text + '</pre>').css({display: 'none'});
CSS如何让DIV的宽度随内容的改变而改变
让div根据内容改变大小 div{ width:auto; display:inline-block !important; display:inline; }
固定Textview,字体随着字数的多少字体动态变化大小
package de.ankri.views; import android.content.Context; import android.content.res.TypedArray; import android.graphics.Paint; import android.util.AttributeSet; import android.util.TypedValue; import
原生静态布局下,用div+css实现界面随着不同的屏幕变换自动调整大小
1 首先用css元素让body和html元素的的height和width设置成100%。   因为当我们设置100%的时候有一个对照的父元素,也就是说参照谁来设置自己高和宽的百分比。   对于有些浏览器来说,把屏幕的高和宽作为body元素的参照父元素,对于有些浏览器来说把屏幕的高和宽作为htm   的参照父元素,所以第一步同时把这两个元素作为参照父元素。2 定义一个盒子div ,设置div的wid...
textarea文本域的高度随内容的变化而变化(适用于编辑文本)
/**                * 文本框根据输入内容自适应高度                * @param                {HTMLElement}        输入框元素                * @param                {Number}                设置光标与输入框保持的距离(默认0)            
父元素随着子元素高度改变而改变
转载自https://blog.csdn.net/friendan/article/details/51043760
当你想一个div的高随着屏幕的高度变化
有些时候我们的Dear总会有一些无理的要求,然后我们还不得不去解决,那么如何让一个div的高随着浏览器的大小来变化呢?尤其是打开浏览器再打开控制台,然后关闭之后,我们会发现,div的高不变化了,就是打开控制台时那么大. 那么下面的就是解决办法,具体如何使用自己研究吧!!!   height:calc(100% - 60px);  ...
iframe 随子页面大小变化而变化
子页面大小小于屏幕大小时,按一屏显示;多于一屏时,出现滚动条。子页面大小发生变化时,iframe自适应。window.setInterval(function(){ var bodyheight = $("#iframe").contents().find("body").height(); var winheight=$(window).height(); if(bodyh
js头部设置浏览器字体大小随窗口大小而改变
/* 长宽占位 rem算法, 根据root的rem来计算各元素相对rem, 默认html 320/20 = 16px */ /* 长宽占位 rem算法, 根据root的rem来计算各元素相对rem, 默认html 320/20 = 16px */  function placeholderPic(){   var w = document.documentEl
标签(div、input)大小随内容变化
标签随内容大小变化
jqGrid随窗口大小变化自适应大小
第一种:  jqGrid随窗口大小变化自适应宽度 $(function(){             $(window).resize(function(){            $("#listId").setGridWidth($(window).width());         });        });      第二种: window.onresize = f
js实现容器的大小随窗口而改变
两种方法方法1&amp;lt;!doctype html&amp;gt;&amp;lt;html&amp;gt;&amp;lt;head&amp;gt;    &amp;lt;meta charset=&quot;utf-8&quot;&amp;gt;    &amp;lt;title&amp;gt;等高等宽&amp;lt;/title&amp;gt;    &amp;lt;meta name=&quot;viewport&quot; content=&quot;width=device-width, us
底部随输入法高度变化而变化的控件SoftLinearLayout
我们经常玩QQ、微信,大家是否认真看过它们的聊天界面,它们的输入框既可以随软键盘高度变化,又可以随底部控件的高度变化,而且底部控件还可以随软键盘高度的调整而自动调整(只不过设置了最小、最大值),看上去是不是觉得很酷呢?今天,我就在这介绍一个比它还好用的控件--SoftLinearLayout。 首先,我们来看一下效果演示图: SoftLinearLayout.g
CSS中让一个div的高度随着另外个一个统计的div的高度变化而变化的代码
.w1002 .left_part{overflow:hidden; padding-bottom:9999px; margin-bottom:-9999px;display:inline;}
textbox的长度随着内容而改变
textbox的长度随着内容而改变textbox的长度随着内容而改变textbox的长度随着内容而改变textbox的长度随着内容而改变
关于Echarts图表根据div大小的改变而改变的问题
var fhchart = echarts.getInstanceById($(&quot;#desk_ygz&quot;).attr(&quot;_echarts_instance_&quot;));//获取echarts对象 if (fhchart) { setTimeout(&quot;echarts.getInstanceById($('#desk_ygz').attr('_echarts_ins...
CSS中如何让图片随背景高度自适应变化高度
div class="mobileBg"> img src="img/mobile.png" alt="" class="imgNewBg" div> .mobileBg{ height: 100%; } .imgNewBg{ height:80%; }需要保证它的背景这个div具有一定的高度,这样img里面的图片可以随着背景盒子的高度自适应而改变高度
arcgis api for javascript 地图随着所在div大小的变化而改变的resize()事件
首先我们需要先创建一个地图,代码: Resizable Map dojo.require("esri.map"); var map; function init(){ map = new esri.Map("map",{//加载地图 log
EasyUi tabs的高度与宽度根据IE窗口的变化自适应代码
EasyUi tabs的高度与宽度根据IE窗口的变化自适应代码 tabs代码如下:  复制代码代码如下:         tabs1          tabs2        如果id="tabs"的div未设置宽度和高度,easyUI默认的宽度和高度是auto,这样在google浏览器下显示正常,但是在IE下默认不显示任何内容,并且和dialog还
解决父元素定位后宽度不随着子元素增大而增大的问题
给子元素加white-space:nowarp
左侧容器跟随右侧容器高度改变而改变
&amp;lt;!DOCTYPE html PUBLIC &quot;-//W3C//DTD XHTML 1.0 Transitional//EN&quot; &quot;http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd&quot;&amp;gt; &amp;lt;html xmlns=&quot;http://www.w3.org/1999/xhtml&quot;&amp;gt; &amp;lt;head&amp;gt;..
css如何让父元素div的高度随着子元素的div的高度变动而自适应
例如:下面的div如果想father的div随着son的div自动适应搞度,只需要加上一个清除浮动的标签即可!&amp;lt;div class='father'&amp;gt; &amp;lt;div class='son'&amp;gt;&amp;lt;/div&amp;gt; &amp;lt;br style='clear:both'/&amp;gt;&amp;lt;!--只要清除浮动即可--&amp;gt; &amp;lt;/div&amp;gt;...
CSS技巧,CSS设置任何元素宽度随内容增加自动变宽
宽度随内容增加自动变宽的问题,看起来简单,但网上各种找不到。 其实感觉以前在布局的时候在哪里遇到过自动变宽,想了好久好像记得只有用table布局的时候吧,但是不可能哪里都用table,如果用层那怎么办呢。 然后又发现了一个熟悉,display!!没错,就是它,很平常的一个属性,块状元素嘛,几乎天天用,居然忽略了。 给元素加上 display:table; 就OK了。 记录一下。不用那么麻烦
文章热词 随机森林参数变化 JavaScript JavaScript培训 JavaScript课程 JavaScript学习
相关热词 c# 随着底部变化 android8.0的变化 c++实现傅里叶变化的作用 人工智能如何实现学习 如何学python