メニュータブの色の変更

HTML
1 <body>
2  <ons-splitter>
3    <ons-splitter-side id="menu" side="left" width="220px" collapse swipeable>
4    
5    //ページの内容
6      <ons-page>
7        <ons-list>
8          <ons-list-header>HOOK</ons-list-header>
9          <ons-list-item onclick="fn.load('tab.html')" tappable>
10            ホーム
11          </ons-list-item>
12          <ons-list-item onclick="fn.load('settings.html')" tappable>
13            設定
14          </ons-list-item>
15          <ons-list-item onclick="fn.load('about.html')" tappable>
16            運営会社
17          </ons-list-item>
18        </ons-list>
19        <ons-list>
20          <ons-list-item onclick="fn.load('login.html')" tappable>
21            ログイン
22          </ons-list-item>
23          
24      </ons-page>

上記の文字色をHTML内で変えたいです。

<ons-list-header　style="color:green;">HOOK</ons-list-header>とやったら、HOOKの部分は色が変わりました。
しかし、<ons-page　style="color:green;>　<ons-list style="color:green;>などのように記述しても、ホーム、設定、ログインの色が変わりません。なぜなのでしょうか？
ご協力願います。

行動規範の内容に同意します

回答1件

ベストアンサー

運営会社は変わっているのですか？
styleの最後が"が閉じられていなかったりもしますし、質問の内容自体がどこまで正確なのか疑問ですが
恐らくons-list-itemにcolorが指定されているからだと思います。

CSS
1.list-item {
2    color: #1f1f21;
3}

この手の質問が多いですが
developer toolsを見ればすぐに分かる内容なので
自分で見れるようになった方が手間が省けて良いんじゃないかと思います。
（毎回毎回質問するのも大変でしょうから。）

投稿2017/11/20 06:41

yuki-saito

総合スコア928

yuki-saito

2017/11/20 06:44

参考にこちらをどうぞ。 https://saruwakakun.com/html-css/basic/chrome-dev-tool ちょっとしたStyleの疑問ぐらいならほぼ自己解決できるようになるはずです。

行動規範の内容に同意します

あなたの回答

tips

プレビュー

行動規範の内容に同意します

質問の解決につながる回答をしましょう。サンプルコードなど、より具体的な説明があると質問者の理解の助けになります。また、読む側のことを考えた、分かりやすい文章を心がけましょう。

15分調べてもわからないことは
teratailで質問しよう！

ただいまの回答率
85.48%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう！

メニュータブの色の変更

関連した質問