V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
Authorization
V2EX  ›  程序员

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

  •  1
     
  •   Authorization · 2022-05-27 15:18:01 +08:00 · 1245 次点击
    这是一个创建于 661 天前的主题,其中的信息可能已经有所发展或是发生改变。
    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; } }
    5 条回复    2022-05-27 22:45:53 +08:00
    learningman
        1
    learningman  
       2022-05-27 15:25:23 +08:00
    你可以直接写在 style 里(
    Authorization
        2
    Authorization  
    OP
       2022-05-27 15:34:15 +08:00
    @learningman 你可以帮我写出来吗?
    learningman
        3
    learningman  
       2022-05-27 15:57:40 +08:00
    @service517 你加一个元素
    <style>.adslot_1 { display:block; width: 320px; height: 50px; }
    @media (max-width: 400px) { .adslot_1 { display: none; } }</style>
    完事,能用
    shaojz2005
        4
    shaojz2005  
       2022-05-27 20:40:10 +08:00
    另外写一个 css ,然后 import 这个 css ?
    yankebupt
        5
    yankebupt  
       2022-05-27 22:45:53 +08:00
    flex 和 adsbygoogle 很可能代码不能改,广告都是硬插进去的,不知道会不会检查外部 div 属性
    写个 div 包起来用你那个 css 不知道会不会违规。
    就 flex 外面再包个<div className="adslot_1">或者<div className="flex adslot_1">...

    瞎说的,试一下再说
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   我们的愿景   ·   实用小工具   ·   5362 人在线   最高记录 6543   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 32ms · UTC 06:56 · PVG 14:56 · LAX 23:56 · JFK 02:56
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.