質問編集履歴
4
HTML追加・写真追加
test
CHANGED
File without changes
|
test
CHANGED
@@ -144,12 +144,16 @@
|
|
144
144
|
|
145
145
|
https://gyazo.com/590e9bd3db9f2c4e66443529bc61e45c
|
146
146
|
|
147
|
+
![イメージ説明](6a5e6ce66402c5b5e08c13320d155e6e.png)
|
148
|
+
|
147
149
|
|
148
150
|
|
149
151
|
【実現したいこと】
|
150
152
|
|
151
153
|
https://gyazo.com/799a703e7af1a052d3ecb7cb0ca0a431
|
152
154
|
|
155
|
+
![イメージ説明](81b43a7d12dd383f5d1d2bbeffd812e7.png)
|
156
|
+
|
153
157
|
|
154
158
|
|
155
159
|
|
3
HTML追加・写真追加
test
CHANGED
File without changes
|
test
CHANGED
@@ -28,9 +28,61 @@
|
|
28
28
|
|
29
29
|
```
|
30
30
|
|
31
|
-
【CSS】
|
32
31
|
|
33
32
|
|
33
|
+
【HTML】
|
34
|
+
|
35
|
+
<!-- メイン -->
|
36
|
+
|
37
|
+
<main>
|
38
|
+
|
39
|
+
<h1 class="main-text">船でしか行けない幻の波照間島の魅力</h1>
|
40
|
+
|
41
|
+
<div class="main-container">
|
42
|
+
|
43
|
+
<div class="box">
|
44
|
+
|
45
|
+
<div class="box-title">日本最南端の島</div>
|
46
|
+
|
47
|
+
<p>波照間島は八重山諸島に位置する人口約500人の島で人が住む島としては日本最南端にあたります。その名前は「果てのウルマ(珊瑚礁)の島」を語源としています。 赤瓦の伝統的な琉球家屋とサンゴの石垣、フクギの並木、そしてサトウキビ畑。島内は静かでのどかな風景が続きます。
|
48
|
+
|
49
|
+
</p>
|
50
|
+
|
51
|
+
</div>
|
52
|
+
|
53
|
+
<div class="box">
|
54
|
+
|
55
|
+
|
56
|
+
|
57
|
+
<div class="box-title">泳げる海は1つだけ</div>
|
58
|
+
|
59
|
+
<p>波照間島の海は地元沖縄県でもとびっきりの美しさを誇っていることで知られています。透明度の高い水、真っ白な砂浜、穏やかな波と、文句のつけようがないパラダイスのようなビーチです。</p>
|
60
|
+
|
61
|
+
</div>
|
62
|
+
|
63
|
+
<div class="box">
|
64
|
+
|
65
|
+
|
66
|
+
|
67
|
+
<div class="box-title">肉眼星空観測</div>
|
68
|
+
|
69
|
+
<p>民家も街灯もなく、文字通り“満天の”星空が広がっています。手に届きそうなほどたくさんの星が輝く空では流れ星や天の川が驚くほどくっきりと輝いており大パノラマの空間に驚くことでしょう。</p>
|
70
|
+
|
71
|
+
</div>
|
72
|
+
|
73
|
+
|
74
|
+
|
75
|
+
</div>
|
76
|
+
|
77
|
+
</main>
|
78
|
+
|
79
|
+
|
80
|
+
|
81
|
+
|
82
|
+
|
83
|
+
![【CSS】
|
84
|
+
|
85
|
+
](b5560f0ae964efe2b2d285ee60b3cb5c.png)
|
34
86
|
|
35
87
|
|
36
88
|
|
@@ -56,31 +108,7 @@
|
|
56
108
|
|
57
109
|
.box {
|
58
110
|
|
59
|
-
max-width: 100%;
|
111
|
+
max-width: 100%;![![イメージ説明](7d60e9dfd59b95d6be994ceebabe43e5.png)](e051bb6b08c334d02c2ecbb09c5a2e92.png)
|
60
|
-
|
61
|
-
margin: 1em;
|
62
|
-
|
63
|
-
border: 1px solid white;
|
64
|
-
|
65
|
-
border-width: 1px;
|
66
|
-
|
67
|
-
background-color: lightgray;
|
68
|
-
|
69
|
-
}
|
70
|
-
|
71
|
-
|
72
|
-
|
73
|
-
|
74
|
-
|
75
|
-
.box-title {
|
76
|
-
|
77
|
-
text-align: center;
|
78
|
-
|
79
|
-
font-size: 2rem;
|
80
|
-
|
81
|
-
font-weight: 400;
|
82
|
-
|
83
|
-
background-color: #87cefa;
|
84
112
|
|
85
113
|
}
|
86
114
|
|
2
実現したいことの追加
test
CHANGED
File without changes
|
test
CHANGED
@@ -8,9 +8,11 @@
|
|
8
8
|
|
9
9
|
|
10
10
|
|
11
|
-
【実現したいこと】
|
11
|
+
**【実現したいこと】
|
12
12
|
|
13
|
-
・PC表示においてボックスを3等分にしたい(幅・高さ均等)
|
13
|
+
・PC表示においてボックスを3等分にしたい(幅・高さ均等)
|
14
|
+
|
15
|
+
・ボックスの「タイトル」の高さを揃える。**
|
14
16
|
|
15
17
|
|
16
18
|
|
@@ -22,7 +24,7 @@
|
|
22
24
|
|
23
25
|
> したが、うまく3等分されなかった。
|
24
26
|
|
25
|
-
|
27
|
+
|
26
28
|
|
27
29
|
```
|
28
30
|
|
1
現状URL張り直し
test
CHANGED
File without changes
|
test
CHANGED
@@ -21,6 +21,8 @@
|
|
21
21
|
> > width : calc(100% / 3)
|
22
22
|
|
23
23
|
> したが、うまく3等分されなかった。
|
24
|
+
|
25
|
+
**※ ボックスの「タイトル」の高さが揃っていないことも直したいです。**
|
24
26
|
|
25
27
|
```
|
26
28
|
|
@@ -110,7 +112,7 @@
|
|
110
112
|
|
111
113
|
【現状】
|
112
114
|
|
113
|
-
https://gyazo.com/
|
115
|
+
https://gyazo.com/590e9bd3db9f2c4e66443529bc61e45c
|
114
116
|
|
115
117
|
|
116
118
|
|