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