ホーム

画像を完全な円にする方法 - html css

0
0

html

<img src="./img/test.jpg" class="circle" alt="Cinque Terre">

css

.circle {
  width: 200px;
  height: 200px;
   /* 幅と高さの半分 */
  -webkit-border-radius: 100px;
  -moz-border-radius: 100px;
  border-radius: 100px;
  background: #C00;
}

参考

[urlpreviewbox url="https://iwb.jp/css-precise-circle-px-percent/"/]

Pocket
LinkedIn にシェア

  • この記事を書いた人
  • 最新記事

藤沢瞭介(Ryosuke Hujisawa)

りょすけと申します。18歳からプログラミングをはじめ、今はフロントエンドでReactを書いたり、AIの勉強を頑張っています。off.tokyoでは、ハイテクやガジェット、それからプログラミングに関する情報まで、エンジニアに役立つ情報を日々発信しています!

-ホーム

Copyright© off.tokyo , 2021 All Rights Reserved Powered by AFFINGER5.