To change the scale of an element, CSS has the transform
property, along with its scale()
function.
The following code example doubles the size of all the paragraph elements on the page:
p { transform: scale(2); }
练习题目:
Increase the size of the element with the id of ball2
to 1.5 times its original size.
练习代码:
1 <style> 2 .ball { 3 width: 40px; 4 height: 40px; 5 margin: 50 auto; 6 position: fixed; 7 background: linear-gradient( 8 35deg, 9 #ccffff, 10 #ffcccc 11 ); 12 border-radius: 50%; 13 } 14 #ball1 { 15 left: 20%; 16 } 17 #ball2 { 18 left: 65%; 19 <!-- 仅在此处填空既可,无需写全部代码--> 20 transform: scale(1.5); 21 } 22 </style> 23 24 <div class="ball" id= "ball1"></div> 25 <div class="ball" id= "ball2"></div>
效果: