質問編集履歴

2

修正しました。

2021/08/18 09:54

投稿

free_teku
free_teku

スコア103

test CHANGED
File without changes
test CHANGED
@@ -66,190 +66,182 @@
66
66
 
67
67
  </div><!-- /.feat-txt -->
68
68
 
69
- </div><!-- /.feat-flex -->
69
+ </li><!-- /.features-item -->
70
+
71
+ </ul><!-- /.features-list -->
70
72
 
71
73
 
72
74
 
75
+ <!--2-->
76
+
77
+ <h4 class="features-ttl">高品質</h4><!--features-ttl / -->
78
+
79
+ <ul class="features-list">
80
+
81
+ <li class="features-item features-flex">
82
+
83
+ <figure><img class="feat-img" src="./image/building_website.png" alt=""></figure>
84
+
85
+ <div class="features-txt">
86
+
87
+ <p class="feat-sub">正しいマークアップで、 内部SEOに強いコーディングを デフォルトで行います。</p>
88
+
89
+ <p class="feat-desc">ユアコーディングでは、「予測しやすい」「再利用しやすい」<br> 「保守しやすい」「拡張しやすい」と言った設計をもとに <br> きちんとコーディングを行うため、納品後も安心です。</p><!-- /.feat-dec -->
90
+
91
+ </div><!-- /.feat-txt -->
92
+
73
93
  </li><!-- /.features-item -->
74
94
 
75
95
  </ul><!-- /.features-list -->
76
96
 
97
+
98
+
99
+ <!--3-->
100
+
101
+ <h4 class="features-ttl">迅速なレスポンス</h4><!--features-ttl / -->
102
+
103
+ <ul class="features-list">
104
+
105
+ <li class="features-item features-flex">
106
+
107
+ <figure><img class="feat-img" src="./image/new_message.png" alt=""></figure>
108
+
109
+ <div class="features-txt">
110
+
111
+ <p class="feat-sub">原則いただいたメッセージは、 業務時間内であれば6時間以内に お返しいたします。</p>
112
+
113
+ <p class="feat-desc">連絡を返さないフリーランスが多い中、 <br> ユアコーディングでは定期的な進捗報告など、 <br> 社会人としての基本を踏まえて仕事を行なって <br> おります。</p><!-- /.feat-dec -->
114
+
115
+ </div><!-- /.feat-txt -->
116
+
117
+
118
+
119
+ </li><!-- /.features-item -->
120
+
121
+ </ul><!-- /.features-list -->
122
+
123
+ ```
124
+
125
+
126
+
127
+ ```feat.scss
128
+
129
+ features.scss
130
+
131
+
132
+
133
+ .features{
134
+
135
+ .features-ttl{
136
+
137
+ font-size: 2.8rem;
138
+
139
+ line-height: 1.4;
140
+
141
+ color: $txt-color;
142
+
143
+ font-weight: bold;
144
+
145
+ text-align: center;
146
+
147
+
148
+
149
+ }
150
+
151
+
152
+
153
+ .features-list{
154
+
155
+ margin: 0 auto;
156
+
157
+
158
+
159
+ .features-item{
160
+
161
+ display: flex;
162
+
163
+ justify-content: space-between;
164
+
165
+ align-items: center;
166
+
167
+ margin-top: 50px;
168
+
169
+
170
+
171
+ .feat-img{
172
+
173
+ display: block;
174
+
175
+ width: 380px;
176
+
177
+ margin-left: 152px;
178
+
179
+ }
180
+
181
+
182
+
183
+ .features-item:nth-child(2){
184
+
185
+ display: flex;
186
+
187
+ flex-direction: row-reverse;
188
+
189
+ .feat-img{
190
+
191
+ display: block;
192
+
193
+ width: 380px;
194
+
195
+ margin-right: 135px;
196
+
197
+
198
+
199
+ }
200
+
201
+ }
202
+
203
+ }
204
+
205
+
206
+
77
207
 
78
208
 
79
- <!--2-->
80
-
81
- <h4 class="features-ttl">高品質</h4><!--features-ttl / -->
82
-
83
- <ul class="features-list">
84
-
85
- <li class="features-item features-flex">
86
-
87
- <figure><img class="feat-img" src="./image/building_website.png" alt=""></figure>
88
-
89
- <div class="features-txt">
90
-
91
- <p class="feat-sub">正しいマークアップで、 内部SEOに強いコーディングを デフォルトで行います。</p>
92
-
93
- <p class="feat-desc">ユアコーディングでは、「予測しやすい」「再利用しやすい」<br> 「保守しやすい」「拡張しやすい」と言った設計をもとに <br> きちんとコーディングを行うため、納品後も安心です。</p><!-- /.feat-dec -->
94
-
95
- </div><!-- /.feat-txt -->
96
-
97
- </div><!-- /.feat-flex -->
98
-
99
-
100
-
101
- </li><!-- /.features-item -->
102
-
103
- </ul><!-- /.features-list -->
104
-
105
-
106
-
107
- <!--3-->
108
-
109
- <h4 class="features-ttl">迅速なレスポンス</h4><!--features-ttl / -->
110
-
111
- <ul class="features-list">
112
-
113
- <li class="features-item features-flex">
114
-
115
- <figure><img class="feat-img" src="./image/new_message.png" alt=""></figure>
116
-
117
- <div class="features-txt">
118
-
119
- <p class="feat-sub">原則いただいたメッセージは、 業務時間内であれば6時間以内に お返しいたします。</p>
120
-
121
- <p class="feat-desc">連絡を返さないフリーランスが多い中、 <br> ユアコーディングでは定期的な進捗報告など、 <br> 社会人としての基本を踏まえて仕事を行なって <br> おります。</p><!-- /.feat-dec -->
122
-
123
- </div><!-- /.feat-txt -->
124
-
125
-
126
-
127
- </li><!-- /.features-item -->
128
-
129
- </ul><!-- /.features-list -->
130
-
131
- ```
132
-
133
-
134
-
135
- ```feat.scss
136
-
137
- features.scss
138
-
139
-
140
-
141
- .features{
142
-
143
- .features-ttl{
144
-
145
- font-size: 2.8rem;
146
-
147
- line-height: 1.4;
148
-
149
- color: $txt-color;
150
-
151
- font-weight: bold;
152
-
153
- text-align: center;
154
-
155
-
209
+ .features-txt{
210
+
211
+ width: 500px;
212
+
213
+ height: 350px;
214
+
215
+
216
+
217
+ .feat-sub{
218
+
219
+ display: block;
220
+
221
+ font-size: 2.4rem;
222
+
223
+ line-height: 2;
224
+
225
+ font-weight: bold;
226
+
227
+ margin-bottom: 54px;
228
+
229
+
230
+
231
+ }
232
+
233
+ .feat-desc{
234
+
235
+
236
+
237
+ }
238
+
239
+ }
240
+
241
+
156
242
 
157
243
  }
158
244
 
159
-
160
-
161
- .features-list{
162
-
163
- margin: 0 auto;
164
-
165
-
166
-
167
- .features-item{
168
-
169
- display: flex;
170
-
171
- justify-content: space-between;
172
-
173
- align-items: center;
174
-
175
- margin-top: 50px;
176
-
177
-
178
-
179
- .feat-img{
180
-
181
- display: block;
182
-
183
- width: 380px;
184
-
185
- margin-left: 152px;
186
-
187
- }
188
-
189
-
190
-
191
- .features-item:nth-child(2){
192
-
193
- display: flex;
194
-
195
- flex-direction: row-reverse;
196
-
197
- .feat-img{
198
-
199
- display: block;
200
-
201
- width: 380px;
202
-
203
- margin-right: 135px;
204
-
205
-
206
-
207
- }
208
-
209
- }
210
-
211
- }
212
-
213
-
214
-
215
-
216
-
217
- .features-txt{
218
-
219
- width: 500px;
220
-
221
- height: 350px;
222
-
223
-
224
-
225
- .feat-sub{
226
-
227
- display: block;
228
-
229
- font-size: 2.4rem;
230
-
231
- line-height: 2;
232
-
233
- font-weight: bold;
234
-
235
- margin-bottom: 54px;
236
-
237
-
238
-
239
- }
240
-
241
- .feat-desc{
242
-
243
-
244
-
245
- }
246
-
247
- }
248
-
249
-
250
-
251
- }
252
-
253
245
  }
254
246
 
255
247
  ```

1

修正しました

2021/08/18 09:53

投稿

free_teku
free_teku

スコア103

test CHANGED
File without changes
test CHANGED
@@ -20,10 +20,6 @@
20
20
 
21
21
 
22
22
 
23
-
24
-
25
-
26
-
27
23
  ### 発生している問題・エラーメッセージ
28
24
 
29
25
 
@@ -42,7 +38,15 @@
42
38
 
43
39
  ```HTML
44
40
 
45
- HTML
41
+ <section class="features">
42
+
43
+ <div class="inner blog-bg">
44
+
45
+ <p class="jp-ttl">ユアコーディング3つの特徴</p><!-- /.jp-ttl -->
46
+
47
+ <p class="en-ttl">FEATURES</p><!-- /.en-ttl -->
48
+
49
+
46
50
 
47
51
  <!--1-->
48
52
 
@@ -118,7 +122,7 @@
118
122
 
119
123
  </div><!-- /.feat-txt -->
120
124
 
121
- </div><!-- /.feat-flex -->
125
+
122
126
 
123
127
  </li><!-- /.features-item -->
124
128