我有这个简单的测试代码:
<html>
<head>
<style type="text/css">
ul{
float:left;
margin:0;
list-style:none;
padding:0;
}
</style>
</head>
<body>
<ul>
<li><input type="checkbox" id="c1" class="checkBox">a</li>
<li><input type="checkbox" id="c2" class="checkBox"/>b</li>
<li><input type="checkbox" id="c3" class="checkBox"/>c</li>
</ul>
<ul>
<li><input type="checkbox" id="c4" class="checkBox"/>d</li>
<li><input type="checkbox" id="c5" class="checkBox"/>e</li>
<li><input type="checkbox" id="c6" class="checkBox" />f</li>
</ul>
<ul>
<li><input type="checkbox" id="c7" class="checkBox"/>g</li>
<li><input type="checkbox" id="c8" class="checkBox"/>h</li>
<li><input type="checkbox" id="c9" class="checkBox"/>i</li>
</ul>
</body>
</html>
结果如下:
但是如果我缩小文本变小但复选框保持不变
如果我放大，文本会变大，但复选框保持不变
是否可以让复选框也改变它们的大小？例如与标签的大小成比例？ 提前致谢
最佳答案
使用 CSS3 缩放列表以及浏览器呈现的复选框!
.extraLarge ul {
-moz-transform: scale(1.50);
-webkit-transform: scale(1.50);
-o-transform: scale(1.50);
transform: scale(1.50);
padding: 10px;
}
关于HTML/CSS : how can I make the checkboxes grow when zooming in and shrink when zooming out?，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/13778963/