>>2
匿名様！
この度はご回答いただきありがとうございました！
無事解決に至りました。
また何かありましたらお力添えいただければ幸いです。

本当にありがとうございました！

>>6
しち様！さきほど書き換え試した所うまく色変換が出来ていました！
私の中では色を変えるのはお借りしてるテンプレートなのでHTMLやCSSが関係してるとは思いませんでした…。てっきり簡単にタグや設定で出来るものとばかり……。
説明画像大変助かります…！これからの回答を募る際の参考にさせていただきます。またご迷惑をお掛けするかもしれませんがその時もお力添えいただければ幸いです。


本当にありがとうございました。

>>5
おそらくテンプレ作成者さんの意図していないHTML構造にしているがために起きている事象だと思われます……。（普通ならしないHTML構造になっているので……）

まあまあ複雑なCSSなので下手に触らず、【文章画面編集】だけ弄ってみる方向にしますね。

>🔷【文章画面編集】は以下に書き換え（自動改行のチェックは外すのがお薦め）
<main>
<article>
<p>#text#</p>
<ul class="menu">
<li>#novel20_戻る#</li>
</ul>
</article>
</main>

>🔷小説本文には試しに以下を入れてみる
あいうえお
かきくけこ
<span style="color:#c0c0c0">文字色を灰色に</span>
さしすせそ


**✅文字色を灰色にするときは、<span>タグを使うのがベター。
<font>でも色は変わるのですが、すでに廃止されたタグなので、現在は使用が非推奨です。
※いきなり<font>タグが無効になるということは今のところないですが、将来どうなるか分からないし……ということで使わないほうが安心。


以上でとりあえず小説本文は基本的に黒文字になり、
あとは文字色を変えたいときにだけ「<span style="color:#c0c0c0">文字色を灰色に</span>」のタグを使えば、読めるようになるとは思います。

本来のテンプレがどういうHTML構造を想定しているか、これだけだと読み取りきれないので正しいデザインになっているか分かりませんが……。


デザイン系で回答を募る場合はHTML・CSSを載せた方が早く問題箇所を特定できるので、
ご参考までに、小説機能におけるHTML・CSSとはどれのことかというざっくり説明画像を置いてゆきます。

>>4
しち様！ご回答ありがとうございます！
確認しましたら<font>タグを使わずに本文を入れた場合でも文字は表示されていませんでした。

🔷全体デザインというのは画像のHEAD編集の認識でお間違いなかったのでしょうか？もしオレンジ色になっている全体デザインの方でしたら【#novel#】と書いてあります
以下はHEAD編集に書いてあるものになります。

<style>
@charset "UTF-8";

/* ウェブフォントの読み込み */
@import url('https://fonts.googleapis.com/css2?family=EB+Garamond:ital,wght@0,400..800;1,400..800&family=Hina+Mincho&family=Noto+Serif+JP:wght@200..900&display=swap');

/* 全体に適用する */
* {
margin: 0;
padding: 0;
box-sizing: border-box;
font-weight: normal;
}

/* root */
:root {
--color: #203744;
--color2: #a7716c;
--white: #fff;
--black: #000;
--font: "Hina Mincho", serif;
}

/* 基本設定 */
body {
min-height: 100vh;
min-height: 100svh;
background: linear-gradient(to bottom, var(--color), var(--black));
text-align: left;
line-height: 1.7;
letter-spacing: 0.1em;
font-size: 13px;
font-family: "EB Garamond", "Noto Serif JP", serif;
color: var(--white);
}

/* 横幅768px以上で読み込む */
@media screen and (min-width: 768px) {
body {
font-size: 14px;
}
}

/* 横幅1024px以上で読み込む */
@media screen and (min-width: 1024px) {
body {
font-size: 15px;
}
}

/* リンク */
a,
a:visited {
font-family: var(--font);
color: var(--white);
transition: .5s all;
}

a:hover,
a:visited:hover {
color: var(--white);
}

header {
margin: 5em auto 1.5em;
}

header img {
display: block;
margin: 1.5em auto;
width: 100px;
height: auto;
}

header h1 {
text-align: center;
font-size: 1.5em;
font-family: var(--font);
color: var(--color2);
}

aside {
margin: 1em auto;
padding: 1em;
width: 80%;
max-width: 400px;
background-color: rgba(0, 0, 0, 0.2);
font-size: 12px;
}

main {
margin: 0 auto;
width: 80%;
max-width: 400px;
}

section {
margin: 3em auto;
padding: 2em;
border: thin solid var(--white);
}

section h2 {
text-decoration: underline;
font-family: var(--font);
font-size: 1.3em;
font-weight: bold;
}

section p {
font-size: 12px;
}

section ul,
section ol {
margin: 0.5em auto 1em;
}

section ul {
list-style-type: none;
}

section ul li a,
section ol li a {
transition: .5s color;
}

section ol {
list-style-position: inside;
list-style-type: decimal-leading-zero;
}

.yoko li {
position: relative;
display: inline-block;
margin-right: 1em;
}

.yoko li::before {
position: absolute;
display: block;
content: '/';
top: 50%;
right: -1em;
transform: translateY(-50%);
}

.yoko li:last-of-type::before {
display: none;
}

/* アーティクル */
article {
margin: 3em auto;
max-width: 700px;
padding: 1.5em;
background-color: var(--white);
}

article h1 {
margin-bottom: 1em;
text-align: center;
font-family: var(--font);
color: var(--black);
}

article p {
color: var(--black);
}

.menu {
margin: 2em auto;
text-align: center;
}

.menu li {
margin: 0 1em;
display: inline-block;
}

.menu li a,
.menu li a:visited {
text-decoration: none;
font-weight: bold;
color: var(--color);
}

/* フォーム系 */
input[type=text] {
width: 80px;
border: none;
border-bottom: thin solid var(--color2);
}

input[type=submit],
button[type=submit] {
border: thin solid var(--color2);
width: auto;
}
</style>





🔷文章画面編集は以下のように書いてあります。

<article>

<div class="menu">
<ul>
<div align="left" style="text-align:left;">#text#</div>
</ul>
</div>
#novel20_戻る#
</article>

横からすみません。
>>3の画像を見るに、CSSやHTMLを修正しないと本文の文字が見えるようにはなりません。
たぶん、本文の文字色が『白（背景と同色）』になっていると思われます。

「<font color="カラーコード">〜</font> の使い方が間違っている」というわけではないので、
おそらくこの<font>による文字色指定を入力していなくても、本文は常に見えないはずですが……
<font>タグを使わずに本文を入れた場合は、ちゃんと文字が表示されるということでしょうか……？

#とりあえず、CSSまたはHTMLで、本文の文字色を白（「color:#fff」または「color:#ffffff」など）にしていないか確認してみてください。
もし白になっていたら、「#000」または「#000000」などの黒色系にすれば視認できるようになります。

#どこを修正すればいいか分からない場合
「CSSやHTMLとはどこにあるの？」という感じでしたら、まずは以下2箇所になんと書いてあるかだけ教えていただけますか？
可能なら、書いてあるものをまるっとコピペでお教えください。

>🔷【全体デザイン】

>🔷【文章画面編集】

>>2
匿名様！ご回答ありがとうございます！
さきほど画像❶のようにカラーコード指定ありと、なしで文章書きを試したのですが、

プレビューで確認したら画像❷のように指定したコードの文章のみが反映されていて、普段通りに書いている文章は反映されませんでした。
これは私のやり方が間違っているのでしょうか。

>>0
<font color="カラーコード">お好きな文章（色が変わる）</font>
で、どうでしょうか？

>>0
すみません、具体的なことを書き忘れていました。


あいうえお（メイン）←黒文字


あいうえお（回想シーン）←薄い色、グレー系

といった感じに一つの本文内で場面によって色を変えたいです。