@mediaが反映されません < SWELLに関する質問

フォーラムをリニューアルしました！
今後は、新フォーラムをご利用ください。

通知

すべてクリア

[解決済] @mediaが反映されません

SWELLに関する質問

最新の投稿 : sekiguchi 3年前

8 投稿

2 ユーザー

0 Likes

1,020 表示

RSS

sekiguchi

(@sekiguchi)

Active Member

Topic starter

追加CSSに以下を記述したのですが@mediaを入れると反映されません。

@mediaを取り除くと反映されます。

ご教授よろしくお願いします。

https://www.skyfolks.net/

投稿済 : 16/07/2021 6:16 am

しらこ

(@96ssbike)

Prominent Member

CSSについてはサポート範囲外になります。

にゃーん .

投稿済 : 16/07/2021 7:01 am

sekiguchi

(@sekiguchi)

Active Member

Topic starter

記述が抜けました。以下になります。

@media screen and ( min-width: 600px) {　

.p-mainVisual__slideTitle{

font-size: 200px ;

font-family:"Noto Serif JP","Hiragino Mincho ProN",serif;

letter-spacing: .125em;

}

.p-mainVisual__slideText{

font-size:50px;

font-family:"Noto Serif JP","Hiragino Mincho ProN",serif;

letter-spacing: .05em;

}

メインビジュアルの文字をデバイスによってフォントを変えたいと思ってます。

投稿済 : 16/07/2021 7:03 am

sekiguchi

(@sekiguchi)

Active Member

Topic starter

しらこさん。

ご返信ありがとうございます。

そうでしたか、失礼いたしました。。。

投稿済 : 16/07/2021 7:04 am

しらこ

(@96ssbike)

Prominent Member

今コピペしていただいたものを一応見ましたが、

@media screen and ( min-width: 600px) {

の直後に全角スペースが入っているからだと思います。

一度、改行が可視化できるテキストエディタにコピペしてみると良いと思います。

テキストエディタは、VS Code, サクラエディタ、TeraPad、Emeditor, 秀丸エディタ、このへんなら何でも良いです。

できれば、下から2行目}の後の半角スペースも消しておいたほうが良いと思いますけどね。

This post was modified 3年前 2回 by しらこ

にゃーん .

投稿済 : 16/07/2021 7:13 am

sekiguchi

(@sekiguchi)

Active Member

Topic starter

解決しました! ありがとうございます。

スペースがあるだけでもダメなんですね。

CSS恐るべしです。

投稿済 : 16/07/2021 7:16 am

しらこ

(@96ssbike)

Prominent Member

解決して良かったです！（ちょろっとしたことなので、解説しました～）

Excelなどの表計算でも、エラーを起こすのでうっかりスペース挿入は全角・半角ともに気をつけていただきたいものです。スペースではなくてもです。"とか'とかも。（ｷﾘｯ

まぁこういう完璧主義があるから自分でも苦労してるな～と思う部分はありますが、おかげでCSSなどとは相性が良いです。

それでもたまに反映できないときはあります。辛抱強くCSSを付き合ってあげてください。

This post was modified 3年前 2回 by しらこ

にゃーん .

投稿済 : 16/07/2021 7:23 am

sekiguchi

(@sekiguchi)

Active Member

Topic starter

お勧めエディターの件もありがとうございます。

早速探してみます。

とても勉強になりました！

投稿済 : 16/07/2021 8:40 am

共有: