React js で条件付きスタイルを実行しようとしています。私は React を初めて使用するので、これを行うより良い方法があるかもしれませんが、インターネットで検索しても役に立ちません。上記の画面サイズに基づいて、画面サイズとスタイルを確認しようとしています。この使用例では、画面サイズに基づいて一部のテキストを中央に配置したいと考えています。これを行うより良い方法があるかどうか誰かが教えてくれますか?現在、これは私にとってはうまくいきません。
編集: そこにいくつかのログを入れると、画面サイズが > 993px であっても、ページが読み込まれるときに「textAlign」が要素にまったく適用されません。画面を < 993px および > 578px に縮小すると、要素に「textAlign:center」が適用され、< 578px に縮小すると、None に戻りません。それを中心に保ちます。
リーリーそれでは、このスタイルを
と呼びます リーリーご協力をよろしくお願いいたします。
最終編集:
そこで、ここではメディア クエリが実際に好ましい方法であることがわかりました。ただし、愚かな間違いを犯し、値が存在しないときに textAlign
を none
に設定しました。プロパティですが、上記の 3 項条件は機能します。この場合、initial
に設定する必要があります。
リーリー
リーリー ###この場合、 ### max-widthmedia query
がここにぴったりです。画面サイズがこの
画面サイズが
min-widthmax-width
より小さい場合、このメディア クエリ
のすべてのスタイルが適用されます。より大きい場合、この
メディア クエリ
のすべてのスタイルが適用されます。