「C#」transformプロパティのscale関数で要素を拡大縮小させる

2014年5月13日2022年3月15日

書式
transform: scale(横の倍数, 縦の倍数);
scale関数を利用して要素を拡大縮小させます。

使用例

<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<!--scale関数で横を1.2倍,縦を0.8倍にする -->
<style>
  .trans {
     transform: scale(1.2, 0.8);
    border: 1px solid #000;
    background-color: skyblue;
    width: 250px;
    height: 60px;
  }
  .cft {
    border: 1px dotted #000;
    background-color: yellow;
    width: 250px;
    height: 60px;
  }
</style>
<body>
  <div class="cft">
    <div class="trans">要素を拡大縮小させる</div>
  </div>
</body>
</html>

実行結果
div要素「trans」の内容はscale関数で横を1.2倍,縦を0.8倍にしています。

Posted by arkgame

関連記事: