15日目 割烹芸人の遊戯
今回は遊び心。開発とは関係ないです。
15日目
前回活動報告のCSSを見ていったわけだけど、面白いスタイルを適用しているところがあったのでそれを使って活動報告をハックします。
1. PCしか見えない部分を作る。
class="dummy"を使うとPC、タブレット端末でしか見えません。
スマホではdisplay:noneが付与されるので見えません。
スマホユーザーには見せたくない場合は指定しましょう（どんなシチュエーションだ……）
例：（※スマホの人は見えません）
コードサンプルコピペ用---
<div class="dummy">ここはスマホの人は見れません。PCでみてね☆</div>
----
2. スマホで開閉ボタンを作る
なぜスマホで見えないページが用意されているのかというと、開閉ボタンのためです。
なろうでの開閉ボタンのクラスである、opentabを使うとdummyにshowクラスが追加され見えるようになります。
ただしPCではまるみえです。（PC版にそういったの多分なかった）
なのでスマホユーザーを驚かせたい場合はこんな風に記述するといいかも。
コードサンプルコピペ用---
<div class="opentab">開閉スイッチ</div><div class="dummy">ここに開閉後のやつが入るのです</div>
----
ただし、プレビューでは反映されないので、実際に公開しないと動作確認ができないです。
プレビューのCSSは本番とは違うCSSなので。
（プレビューとはなんぞや……、クラスを使う変態さんは想定されていないようです）
※class="opentab"とclass="dummy"の要素の間に改行はいれてはいけません。改行するとbrにshowタグが付与されます。
なお、このCSSは作者マイページの活動報告でしかこれは有効ではないです。
自分が書いた編集用活動報告ページ（https://syosetu.com/userblogmanage/）では見ることができません。
皆が見れるページは（https://mypage.syosetu.com/mypageblog/）でしか有効ではないです。
もし反映されないということであれば多分これのせい。CSSは統一されてないので。
そのあたりを注意して使うといいですね。
ということで割烹ハックでした。
