囲い付きのQ&A 部品

色変えが可能な囲い付きのQ&Aの部品です。
イラストは、男性と女性を用意しました。またご自身で作られた写真も配置できます。


囲いが付いているので、じかに本文に配置するタイプの部品です。
(他には、フレーム部品やエリア部品を配置した後、その中に入れるQ&A部品も別ページにあります)


Q&A-01 (色調整のできる部品)タイトルロゴの色は変えられません
q

ああああああああああああああああああああああああああ

q

ああああああああああああああああああああああああああ

「Q&A-01」編集解説
ますは色の編集をします。
<div class="qa-box" style="border: 1px solid #58b9c8;background-color: #FFFFFF;">
こんな記述が1行目に見つかると思います。
ピンクの #58b9c8 この部分は囲み罫線の色です、色のコードで差し変えてください。
ピンクの #FFFFFF この部分はアンサーエリアの背景色です、色のコードで差し変えてください。(今は#FFFFFFなので白です)

次の行に、<div class="qa-up" style="background-color: #cefbfa;">
こんな記述が見つかると思います。
ピンクの #cefbfa この部分はクエッションエリアの背景色です、色のコードで差し変えてください
文字はワードプレスのエディターで直接、文字の打ち直しや色太さなどを編集してください。
Q&A-02 (色調整のできる部品)タイトルロゴの色は変えられません
q

ああああああああああああああああああああああああああ

q

ああああああああああああああああああああああああああ

「Q&A-02」編集解説
ますは色の編集をします。
<div class="qa-box" style="border: 1px solid #b42e53;background-color: #FFFFFF;">
こんな記述が1行目に見つかると思います。
ピンクの #b42e53 この部分は囲み罫線の色です、色のコードで差し変えてください。
ピンクの #FFFFFF この部分はアンサーエリアの背景色です、色のコードで差し変えてください。(今は#FFFFFFなので白です)

次の行に、<div class="qa-up" style="background-color: #ffe8ee;">
こんな記述が見つかると思います。
ピンクの #ffe8ee この部分はクエッションエリアの背景色です、色のコードで差し変えてください
文字はワードプレスのエディターで直接、文字の打ち直しや色太さなどを編集してください。
Q&A-03 (色調整のできる部品)タイトルロゴの色は変えられません
q

ああああああああああああああああああああああああああ

q

ああああああああああああああああああああああああああ

「Q&A-03」編集解説
ますは色の編集をします。
<div class="qa-box" style="border: 1px solid #58b9c8;background-color: #FFFFFF;">
こんな記述が1行目に見つかると思います。
ピンクの #58b9c8 この部分は囲み罫線の色です、色のコードで差し変えてください。
ピンクの #FFFFFF この部分はアンサーエリアの背景色です、色のコードで差し変えてください。(今は#FFFFFFなので白です)

次の行に、<div class="qa-up" style="background-color: #cefbfa;">
こんな記述が見つかると思います。
ピンクの #cefbfa この部分はクエッションエリアの背景色です、色のコードで差し変えてください
文字はワードプレスのエディターで直接、文字の打ち直しや色太さなどを編集してください。
Q&A-04 (色調整のできる部品)タイトルロゴの色は変えられません
q

ああああああああああああああああああああああああああ

q

ああああああああああああああああああああああああああ

「Q&A-04」編集解説
ますは色の編集をします。
<div class="qa-box" style="border: 1px solid #b42e53;background-color: #FFFFFF;">
こんな記述が1行目に見つかると思います。
ピンクの #b42e53 この部分は囲み罫線の色です、色のコードで差し変えてください。
ピンクの #FFFFFF この部分はアンサーエリアの背景色です、色のコードで差し変えてください。(今は#FFFFFFなので白です)

次の行に、<div class="qa-up" style="background-color: #ffe8ee;">
こんな記述が見つかると思います。
ピンクの #ffe8ee この部分はクエッションエリアの背景色です、色のコードで差し変えてください
文字はワードプレスのエディターで直接、文字の打ち直しや色太さなどを編集してください。
Q&A-05 (色調整のできる部品)タイトルロゴの色は変えられません
q

ああああああああああああああああああああああああああ

q

ああああああああああああああああああああああああああ

「Q&A-05」編集解説
ますは色の編集をします。
<div class="qa-box" style="border: 1px solid #58b9c8;background-color: #FFFFFF;">
こんな記述が1行目に見つかると思います。
ピンクの #58b9c8 この部分は囲み罫線の色です、色のコードで差し変えてください。
ピンクの #FFFFFF この部分はアンサーエリアの背景色です、色のコードで差し変えてください。(今は#FFFFFFなので白です)

次の行に、<div class="qa-up" style="background-color: #cefbfa;">
こんな記述が見つかると思います。
ピンクの #cefbfa この部分はクエッションエリアの背景色です、色のコードで差し変えてください
文字はワードプレスのエディターで直接、文字の打ち直しや色太さなどを編集してください。
Q&A-06 (色調整のできる部品)タイトルロゴの色は変えられません
q

ああああああああああああああああああああああああああああああああああああああああああああああああ

q

ああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああ

「Q&A-06」編集解説
ますは色の編集をします。
<div class="qa-box" style="border: 1px solid #000;background-color: #464545;">
こんな記述が1行目に見つかると思います。
ピンクの #000 この部分は囲み罫線の色です、色のコードで差し変えてください。
ピンクの #464545 この部分はアンサーエリアの背景色です、色のコードで差し変えてください。

次の行に、<div class="qa-up" style="background-color: #000;">
こんな記述が見つかると思います。
ピンクの #000 この部分はクエッションエリアの背景色です、色のコードで差し変えてください
文字はワードプレスのエディターで直接、文字の打ち直しや色太さなどを編集してください。
Q&A-07 (色調整のできる部品)タイトルロゴの色は変えられません

男性・女性のイラスト付き部品。イラストではなくご自身が作られた写真もセットできます。

os
q

ああああああああああああああああああああああああああ

東京都板橋区36歳男性 A様
mqa-right
q

ああああああああああああああああああああああああああ

mqa-right
3
「Q&A-01」編集解説
ますは色の編集をします。
<div class="qa-box" style="border: 1px solid #58b9c8;background-color: #FFFFFF;">
こんな記述が1行目に見つかると思います。
ピンクの #58b9c8 この部分は囲み罫線の色です、色のコードで差し変えてください。
ピンクの #FFFFFF この部分はアンサーエリアの背景色です、色のコードで差し変えてください。(今は#FFFFFFなので白です)

次の行に、<div class="qa-up" style="background-color: #cefbfa;">
こんな記述が見つかると思います。
ピンクの #cefbfa この部分はクエッションエリアの背景色です、色のコードで差し変えてください
文字はワードプレスのエディターで直接、文字の打ち直しや色太さなどを編集してください。
男女のイラストを差し替える
イラストの差し替えは、記述の下の方に<div class="m-qa-photo">
<img src="image/free-photo/man.jpg" width="100%" height="auto" alt="3" /></div>
こんな喜寿が見つかると思います。
ピンクの部分を変えていきます。 man なら男性のイラストが、 woman なら女性のイラストが設置されます。
ご自身が作った写真をセットするには
まずは写真を作ります。だいたいの縦横比率を合わせて作ってみてください。自動で横幅は調整されます。縦はオート設定なので複数の写真の見た目を揃えるなら大きさは揃えて作ってみてください。

作られた画像は、 「 user-photo 」フォルダーの中に作ったフォルダーにアップしてください。
場所は、 「 wp-content 」フォルダーの中の、 「 fthemes 」フォルダーの中の、 「 wordpress-landingpage 」フォルダーの中の、
「 image 」フォルダーの中の、 「 user-photo 」フォルダーの中に作った登録フォルダー内にアップしてください。ワードプレスは階層が深いので注意してアップしてください。
記述の下の方に<div class="m-qa-photo">
<img src="image/user-photo/man.jpg" width="100%" height="auto" alt="3" /></div>
こんな喜寿が見つかると思います。
man.jpg この部分を作った写真の名前に拡張子ごと変えてください。
Q&A-08 (色調整のできる部品)タイトルロゴの色は変えられません

男男性・女性のイラスト付き部品。イラストではなくご自身が作られた写真もセットできます。

os
q

ああああああああああああああああああああああああああ

東京都板橋区36歳女性 A様
mqa-right
q

ああああああああああああああああああああああああああ

mqa-right
3
「Q&A-08」編集解説
ますは色の編集をします。
<div class="qa-box" style="border: 1px solid #ff7bf7;background-color: #FFFFFF;">
こんな記述が1行目に見つかると思います。
ピンクの #ff7bf7 この部分は囲み罫線の色です、色のコードで差し変えてください。
ピンクの #FFFFFF この部分はアンサーエリアの背景色です、色のコードで差し変えてください。(今は#FFFFFFなので白です)

次の行に、<div class="qa-up" style="background-color: #ffe5fd;">
こんな記述が見つかると思います。
ピンクの #ffe5fd この部分はクエッションエリアの背景色です、色のコードで差し変えてください
文字はワードプレスのエディターで直接、文字の打ち直しや色太さなどを編集してください。
男女のイラストを差し替える
イラストの差し替えは、記述の下の方に<div class="m-qa-photo">
<img src="image/free-photo/woman.jpg" width="100%" height="auto" alt="3" /></div>
こんな喜寿が見つかると思います。
ピンクの部分を変えていきます。 man なら男性のイラストが、 woman なら女性のイラストが設置されます。
ご自身が作った写真をセットするには
まずは写真を作ります。だいたいの縦横比率を合わせて作ってみてください。自動で横幅は調整されます。縦はオート設定なので複数の写真の見た目を揃えるなら大きさは揃えて作ってみてください。

作られた画像は、 「 user-photo 」フォルダーの中に作ったフォルダーにアップしてください。
場所は、 「 wp-content 」フォルダーの中の、 「 fthemes 」フォルダーの中の、 「 wordpress-landingpage 」フォルダーの中の、
「 image 」フォルダーの中の、 「 user-photo 」フォルダーの中に作った登録フォルダー内にアップしてください。ワードプレスは階層が深いので注意してアップしてください。
記述の下の方に<div class="m-qa-photo">
<img src="image/user-photo/woman.jpg" width="100%" height="auto" alt="3" /></div>
こんな喜寿が見つかると思います。
man.jpg この部分を作った写真の名前に拡張子ごと変えてください。
Q&A-09 (色調整のできる部品)タイトルロゴの色は変えられません

男男性・女性のイラスト付き部品。イラストではなくご自身が作られた写真もセットできます。

os
q

ああああああああああああああああああああああああああ

東京都板橋区36歳女性 A様
mqa-right
q

ああああああああああああああああああああああああああ

mqa-right
3
「Q&A-09」編集解説
ますは色の編集をします。
<div class="qa-box" style="border: 1px solid #ffa569;background-color: #FFFFFF;">
こんな記述が1行目に見つかると思います。
ピンクの #ffa569 この部分は囲み罫線の色です、色のコードで差し変えてください。
ピンクの #FFFFFF この部分はアンサーエリアの背景色です、色のコードで差し変えてください。(今は#FFFFFFなので白です)

次の行に、<div class="qa-up" style="background-color: #ffe8d9;">
こんな記述が見つかると思います。
ピンクの #ffe8d9 この部分はクエッションエリアの背景色です、色のコードで差し変えてください
文字はワードプレスのエディターで直接、文字の打ち直しや色太さなどを編集してください。
男女のイラストを差し替える
イラストの差し替えは、記述の下の方に<div class="m-qa-photo">
<img src="image/free-photo/woman.jpg" width="100%" height="auto" alt="3" /></div>
こんな喜寿が見つかると思います。
ピンクの部分を変えていきます。 man なら男性のイラストが、 woman なら女性のイラストが設置されます。
ご自身が作った写真をセットするには
まずは写真を作ります。だいたいの縦横比率を合わせて作ってみてください。自動で横幅は調整されます。縦はオート設定なので複数の写真の見た目を揃えるなら大きさは揃えて作ってみてください。

作られた画像は、 「 user-photo 」フォルダーの中に作ったフォルダーにアップしてください。
場所は、 「 wp-content 」フォルダーの中の、 「 fthemes 」フォルダーの中の、 「 wordpress-landingpage 」フォルダーの中の、
「 image 」フォルダーの中の、 「 user-photo 」フォルダーの中に作った登録フォルダー内にアップしてください。ワードプレスは階層が深いので注意してアップしてください。
記述の下の方に<div class="m-qa-photo">
<img src="image/user-photo/woman.jpg" width="100%" height="auto" alt="3" /></div>
こんな喜寿が見つかると思います。
man.jpg この部分を作った写真の名前に拡張子ごと変えてください。
Q&A-10 (色調整のできる部品)タイトルロゴの色は変えられません

男男性・女性のイラスト付き部品。イラストではなくご自身が作られた写真もセットできます。

os
q

ああああああああああああああああああああああああああ

東京都板橋区36歳女性 A様
mqa-right
q

ああああああああああああああああああああああああああ

mqa-right
3
「Q&A-10」編集解説
ますは色の編集をします。
<div class="qa-box" style="border: 1px solid #08cc52;background-color: #FFFFFF;">
こんな記述が1行目に見つかると思います。
ピンクの #08cc52 この部分は囲み罫線の色です、色のコードで差し変えてください。
ピンクの #FFFFFF この部分はアンサーエリアの背景色です、色のコードで差し変えてください。(今は#FFFFFFなので白です)

次の行に、<div class="qa-up" style="background-color: #bbffd5;">
こんな記述が見つかると思います。
ピンクの #bbffd5 この部分はクエッションエリアの背景色です、色のコードで差し変えてください
文字はワードプレスのエディターで直接、文字の打ち直しや色太さなどを編集してください。
男女のイラストを差し替える
イラストの差し替えは、記述の下の方に<div class="m-qa-photo">
<img src="image/free-photo/woman.jpg" width="100%" height="auto" alt="3" /></div>
こんな喜寿が見つかると思います。
ピンクの部分を変えていきます。 man なら男性のイラストが、 woman なら女性のイラストが設置されます。
ご自身が作った写真をセットするには
まずは写真を作ります。だいたいの縦横比率を合わせて作ってみてください。自動で横幅は調整されます。縦はオート設定なので複数の写真の見た目を揃えるなら大きさは揃えて作ってみてください。

作られた画像は、 「 user-photo 」フォルダーの中に作ったフォルダーにアップしてください。
場所は、 「 wp-content 」フォルダーの中の、 「 fthemes 」フォルダーの中の、 「 wordpress-landingpage 」フォルダーの中の、
「 image 」フォルダーの中の、 「 user-photo 」フォルダーの中に作った登録フォルダー内にアップしてください。ワードプレスは階層が深いので注意してアップしてください。
記述の下の方に<div class="m-qa-photo">
<img src="image/user-photo/woman.jpg" width="100%" height="auto" alt="3" /></div>
こんな喜寿が見つかると思います。
man.jpg この部分を作った写真の名前に拡張子ごと変えてください。
Q&A-11 (色調整のできる部品)タイトルロゴの色は変えられません

男男性・女性のイラスト付き部品。イラストではなくご自身が作られた写真もセットできます。

os
q

ああああああああああああああああああああああああああ

東京都板橋区36歳女性 A様
mqa-right
q

ああああああああああああああああああああああああああ

mqa-right
3
「Q&A-11」編集解説
ますは色の編集をします。
<div class="qa-box" style="border: 1px solid #ffa569;background-color: #FFFFFF;">
こんな記述が1行目に見つかると思います。
ピンクの #ffa569 この部分は囲み罫線の色です、色のコードで差し変えてください。
ピンクの #FFFFFF この部分はアンサーエリアの背景色です、色のコードで差し変えてください。(今は#FFFFFFなので白です)

次の行に、<div class="qa-up" style="background-color: #ffe8d9;">
こんな記述が見つかると思います。
ピンクの #ffe8d9 この部分はクエッションエリアの背景色です、色のコードで差し変えてください
文字はワードプレスのエディターで直接、文字の打ち直しや色太さなどを編集してください。
男女のイラストを差し替える
イラストの差し替えは、記述の下の方に<div class="m-qa-photo">
<img src="image/free-photo/woman.jpg" width="100%" height="auto" alt="3" /></div>
こんな喜寿が見つかると思います。
ピンクの部分を変えていきます。 man なら男性のイラストが、 woman なら女性のイラストが設置されます。
ご自身が作った写真をセットするには
まずは写真を作ります。だいたいの縦横比率を合わせて作ってみてください。自動で横幅は調整されます。縦はオート設定なので複数の写真の見た目を揃えるなら大きさは揃えて作ってみてください。

作られた画像は、 「 user-photo 」フォルダーの中に作ったフォルダーにアップしてください。
場所は、 「 wp-content 」フォルダーの中の、 「 fthemes 」フォルダーの中の、 「 wordpress-landingpage 」フォルダーの中の、
「 image 」フォルダーの中の、 「 user-photo 」フォルダーの中に作った登録フォルダー内にアップしてください。ワードプレスは階層が深いので注意してアップしてください。
記述の下の方に<div class="m-qa-photo">
<img src="image/user-photo/woman.jpg" width="100%" height="auto" alt="3" /></div>
こんな喜寿が見つかると思います。
man.jpg この部分を作った写真の名前に拡張子ごと変えてください。
Q&A-12 (色調整のできる部品)タイトルロゴの色は変えられません

男男性・女性のイラスト付き部品。イラストではなくご自身が作られた写真もセットできます。

os
q

ああああああああああああああああああああああああああああああああああああああああああああああああ

東京都板橋区36歳女性 A様
mqa-right
q

ああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああ

mqa-right
3
「Q&A-12」編集解説
ますは色の編集をします。
<div class="qa-box" style="border: 1px solid #000;background-color: #464545;">
こんな記述が1行目に見つかると思います。
ピンクの #000 この部分は囲み罫線の色です、色のコードで差し変えてください。
ピンクの #464545 この部分はアンサーエリアの背景色です、色のコードで差し変えてください。

次の行に、<div class="qa-up" style="background-color: #000;">
こんな記述が見つかると思います。
ピンクの #000 この部分はクエッションエリアの背景色です、色のコードで差し変えてください
文字はワードプレスのエディターで直接、文字の打ち直しや色太さなどを編集してください。
男女のイラストを差し替える
イラストの差し替えは、記述の下の方に<div class="m-qa-photo">
<img src="image/free-photo/woman.jpg" width="100%" height="auto" alt="3" /></div>
こんな喜寿が見つかると思います。
ピンクの部分を変えていきます。 man なら男性のイラストが、 woman なら女性のイラストが設置されます。
ご自身が作った写真をセットするには
まずは写真を作ります。だいたいの縦横比率を合わせて作ってみてください。自動で横幅は調整されます。縦はオート設定なので複数の写真の見た目を揃えるなら大きさは揃えて作ってみてください。

作られた画像は、 「 user-photo 」フォルダーの中に作ったフォルダーにアップしてください。
場所は、 「 wp-content 」フォルダーの中の、 「 fthemes 」フォルダーの中の、 「 wordpress-landingpage 」フォルダーの中の、
「 image 」フォルダーの中の、 「 user-photo 」フォルダーの中に作った登録フォルダー内にアップしてください。ワードプレスは階層が深いので注意してアップしてください。
記述の下の方に<div class="m-qa-photo">
<img src="image/user-photo/woman.jpg" width="100%" height="auto" alt="3" /></div>
こんな喜寿が見つかると思います。
man.jpg この部分を作った写真の名前に拡張子ごと変えてください。
os