gpt4 book ai didi

css - 缩放 css 样式不适用于定位的绝对 div 元素及其在 IE 中的子元素

转载 作者:行者123 更新时间:2023-11-28 18:19:40 24 4
gpt4 key购买 nike

下面是用于测试的html代码。在其他浏览器中,所有 3-div 都按比例缩小 0.5。但是在IE(包括IE9)中,绝对定位的div(second-depth div)和它的子div(third-depth div)没有正常缩小。

如何为所有 div 正确应用缩放样式?

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="ko" xml:lang="ko">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body style="zoom:0.5">
<div style="width:400px;height:400px;background:red">
<div style="position:absolute;width:200px;height:200px;background:black">
<div style="width:100px;height:100px;background:blue"></div>
</div>
</div>
</body>
</html>

最佳答案

zoom 是一个非标准的 IE 属性。其他一些浏览器(如 firefox)会简单地忽略它

缩放元素的符合标准的方法是使用scale() transform-function .

body {
-webkit-transform: scale(.5);
-moz-transform: scale(.5);
transform: scale(.5);
}

比较 http://jsfiddle.net/tqMsv/ (缩放)与 http://jsfiddle.net/tqMsv/1/ (规模)

关于css - 缩放 css 样式不适用于定位的绝对 div 元素及其在 IE 中的子元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17270457/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com