JQuery 設置元素的高度和寬度相等

時間 2019-11-11

標籤 jquery 設置元素高度寬度相等欄目 JQuery 简体版

原文原文鏈接

有時須要設置下面的狀況，即 <div> 的高度和寬度是相等的、而且隨着屏幕的大小變化而變化。這樣就須要用 js 來控制元素在頁面上的顯示。javascript

<html>
css

<body>html

<div class="row text-center margin-top-20p">java

<div class="col bgcolor-FF9600 border-radius-5p margin-2p height-width">spa

<p class="white">你是</p>orm

<p class="white" ng-bind="userLever.name"></p>htm

</div>ip

<div class="col bgcolor-FECA14 border-radius-5p margin-2p height-width" ng-if="userLever.discount != 10">it

<p class="white">享受</p>class

<p class="white">{{userLever.discount}}折</p>

</div>

</div>

</div>

<body>

</html>

//設置元素的高度

var height = $(".height-width").width();

$(".height-width").css("height",height );

$(".height-width-child").css("height",height );

$(".height-width p:first-child").css("margin-top",Math.ceil(height/4)+"px");

$(".height-width-child p").css("line-height",height+"px");

</script>

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。