Hide header and footer when print but keep the default page count

I'm working with a html file and i want to hide the default header and footer that browser auto added in when printing with Ctrl + P, but i want to keep the default page counter of browser

I tried this but it not work

      @page {

                /* This removes any custom header that might show the title */
                @top-center {
                    content: none;
                }
                @top-left {
                    content: none;
                }
                @top-right {
                    content: none;
                }

                
            }

I found the answer. Turn out I just need to make those contents I don't need the same color as background to hide them

@page {
    @top-center {
        content: '';
        color: transparent;
    }
    @bottom-right {
        content: '' counter(page) ' / ' counter(pages);
        margin-bottom: 15px;
        margin-right: 10px;
    }
}