小编Imm*_*ggi的帖子

我试图在屏幕仅移动时隐藏轮播组件并将其显示在平板电脑或更大的屏幕中。最好的方法是什么？我正在使用引导程序。

为了简单起见，下面是我的代码的编辑版本。如您所见，这是我的主页，位于顶部。我希望将其隐藏在移动版本中。感谢您的帮助！

import React from 'react'
import { Container, Row, Col } from 'react-bootstrap';
import { HomeStyled } from './style';
import HomePageCarousel from '../Carousel';



const Home = () => {
    
    return (
    <>    
        **<HomePageCarousel/>**
        <HomeStyled>
            <Container fluid>
            <Row>
                <Col>   
                </Col> 
            </Row>
            <Row>
            </Row>
            </Container>
        </HomeStyled>
    </>
    )
}

export default Home;

下面是 CSS，我在其中使用样式组件..

import styled from 'styled-components';

export const HomeStyled = styled.section`

@media screen and (min-width: 320px) and (max-width: 576px) {
    img,
    p   {
        display: none;
    }
}

.left-alignment { …