通过 CSS 禁止显示屏幕小于 400PX 的屏幕显示广告

[Authorization]

import React from 'react';

export default class Ad extends React.Component {
componentDidMount() {
((window as any).adsbygoogle = (window as any).adsbygoogle || []).push({});
}

render() {
return (
<div className="flex">
<ins
className="adsbygoogle gri-bg"
style={{
display: 'inline-block',
width: '970px',
height: '60px',
margin: 'auto',
}}
data-ad-client="ca-pub-1880000000000"
data-ad-slot="12000000"
data-ad-channel="780000000"
/>{' '}
</div>
);
}
}

问题是我要把这段加进去怎么加？
.adslot_1 { display:block; width: 320px; height: 50px; }
@media (max-width: 400px) { .adslot_1 { display: none; } }

[learningman]

你可以直接写在 style 里（

[Authorization]

@learningman 你可以帮我写出来吗？

[learningman]

@service517 你加一个元素
<style>.adslot_1 { display:block; width: 320px; height: 50px; }
@media (max-width: 400px) { .adslot_1 { display: none; } }</style>
完事，能用

[shaojz2005]

另外写一个 css ，然后 import 这个 css ？

[yankebupt]

flex 和 adsbygoogle 很可能代码不能改，广告都是硬插进去的，不知道会不会检查外部 div 属性
写个 div 包起来用你那个 css 不知道会不会违规。
就 flex 外面再包个<div className="adslot_1">或者<div className="flex adslot_1">...

瞎说的，试一下再说