回答編集履歴

2

修正

2020/05/12 00:01

投稿

new1ro
new1ro

スコア4528

test CHANGED
@@ -5,6 +5,8 @@
5
5
  上記、正円にしたい、楕円はNGなのだと解釈しました。
6
6
 
7
7
 
8
+
9
+ ---
8
10
 
9
11
  `<div style="width:10%;height:10%;">`
10
12
 
@@ -29,3 +31,15 @@
29
31
  </div>
30
32
 
31
33
  ```
34
+
35
+
36
+
37
+ ---
38
+
39
+ また、画像の上下か、画像の左右に"不要な余白"がでてしまうと感じるのであれば
40
+
41
+
42
+
43
+ `background-size:contain;`ではなく
44
+
45
+ `background-size:cover;`にすると、"不要な余白"が消えると思います。

1

修正

2020/05/12 00:01

投稿

new1ro
new1ro

スコア4528

test CHANGED
@@ -12,10 +12,6 @@
12
12
 
13
13
 
14
14
 
15
- `<div style="width:10vw;height:10vh;">`
16
-
17
- もしくは
18
-
19
15
  `<div style="width:200px;height:200px;">`
20
16
 
21
17
  というように、「%」指定でない書き方をすると、とりあえず正円になると思います。
@@ -24,7 +20,7 @@
24
20
 
25
21
  ```HTML
26
22
 
27
- <div style="width:10vw;height:10vh;"><!--変更-->
23
+ <div style="width:200px;height:200px;"><!--変更-->
28
24
 
29
25
  <div style="width:150%;height:150%;background:transparent url('https://www.seo-pro.jp/seo/wp-content/uploads/2019/05/eycatch-2.jpg') no-repeat center;background-size:contain;border-radius:50%">
30
26